デザイナーと開発者が共同作業できる、ブラウザで動くオープンソースのデザインツールです。
・企業:デザインチームと開発チームの連携をスムーズにし、デザイントークン(色やフォントなどの共通ルール)を一元管理することで、製品のUI品質を統一できます。 ・スタートアップ:Figmaのようなデザインツールをライセンス費用なしで利用でき、自社サーバーにホストすることでデザインデータのセキュリティも確保できます。 ・個人事業主・フリーランス:ブラウザだけでプロトタイプやデザインを作成でき、クライアントとの共有もリンクひとつで簡単に行えます。
FigmaやAdobe XDはユーザーあたりの月額課金が発生しデータも外部に保管されますが、Penpotは完全無料で利用でき、SVGやCSSなどのオープンな標準技術をベースにしているため特定のツールに縛られません。
Penpotは、デザインとコードのコラボレーションのための初のオープンソースデザインツールです。デザイナーは美しいデザイン、インタラクティブなプロトタイプ、大規模なデザインシステムを作成でき、開発者はすぐに使えるコードで簡単かつ迅速にワークフローを進められます。そしてこれらすべてが、引き継ぎのトラブルなく実現します。
ブラウザまたはセルフホストで利用可能なPenpotは、SVG、CSS、HTML、JSONなどのオープンスタンダードに対応しており、無料です!
最新のアップデートにより、Penpotはさらに進化しました。ネイティブなデザイントークンを統合した初のデザインツールであり、プロダクトデザインと開発間の効率とコラボレーションを向上させる単一の真実の情報源となります。 大規模な2.0リリースにより、Penpotはプラットフォームをまったく新しいレベルに引き上げました。このアップデートでは、画期的なCSS Grid Layoutフィーチャー、完全なUIリデザイン、新しいコンポーネントシステムなどが導入されています。 チーム向けの追加サービスが必要な組織は、お問い合わせください
🎇 デザイン、コード、オープンソースがPenpot Festで出会います!2025年10月9日〜10日にスペイン・マドリードで開催される2025年版にぜひご参加ください。
目次
なぜPenpotなのか
Penpotはデザインをコードとして表現します。デザイナーは最高の仕事ができ、それが開発者によって美しく実装されることを双方向のコラボレーションで確認できます。
プラグインシステム
Penpotプラグインにより、プラットフォームの機能を拡張し、他のアプリと統合し、カスタムソリューションを設計する柔軟性が得られます。
開発者のために設計
Penpotはデザイナーと開発者の両方に対応し、流動的なデザイン-コードプロセスを実現するために構築されました。リアルタイムコラボレーションを楽しむか、「ソロ」でプレイするかを選択できます。
インスペクトモード
すぐに使えるコードで作業し、ワークフローを簡単かつ迅速にしましょう。インスペクトタブでSVG、CSS、HTMLコードに即座にアクセスできます。
独自インスタンスのセルフホスト
チームや組織に完全に所有するコラボレーティブデザインツールを提供しましょう。Penpotのクラウドサービスを使用するか、独自のPenpotサーバーをデプロイできます。
インテグレーション
PenpotはWebhookのサポートとアクセストークンを通じてアクセス可能なAPIにより、開発ツールチェーンとの統合を提供します。
デザインシステムの構築:デザイントークン、コンポーネント、バリアント
Penpotはコード志向のチームにデザインシステムをもたらします。ネイティブなDesign Tokens、Components、Variantsによる単一の真実の情報源で、プロジェクトやプラットフォーム全体でスケーラブル、再利用可能、一貫性のあるUIを実現します。
はじめに
Penpotはデプロイ方法を問わない唯一のデザイン&プロトタイプ プラットフォームです。SAASで使用することも、どこにでもデプロイすることもできます。
Docker、Kubernetes、Elestioなどでのインストール方法は当社ウェブサイトをご覧ください。
コミュニティ
私たちはオープンソースソフトウェアコミュニティを愛しています。コントリビュートは私たちの情熱であり、あなたもそうであれば、参加してPenpotを改善してください。あなたのデザイン、コード、アイデアはすべて歓迎します!
ヘルプや質問がある場合、Penpotの使用体験を共有したい場合やインスピレーションを得たい場合、開発者やデザイナーのコミュニティに会いたい場合は、コミュニティに参加してください!
以下のカテゴリがあります:
- コミュニティに質問
- トラブルシューティング
- Penpotの改善を手伝う
- #MadeWithPenpot
- イベントとお知らせ
- Inside Penpot
- あなたの言語でPenpot
- デザインとコードの基本
行動規範
コード、コミュニティ、イベントを通じてPenpotにコントリビュートする方は、行動規範を遵守し、前向きで安全な環境を促進する必要があります。
コントリビュート
どんな貢献もPenpotの改善に違いをもたらします。どのように参加できますか?
あなたに合った方法を選んでください:
- コミュニティに役立つライブラリとテンプレートを作成・共有する
- チームを招待する
- このリポジトリにスターを付け、ソーシャルメディアでフォロー:Mastodon、Youtube、Instagram、Linkedin、Peertube、X、BlueSky
- コミュニティスペースで質問や回答をし、他の人の記事にリアクションし、自分の会話を始め、プロジェクトに影響する決定をフォローする
- 簡単なバグ報告ガイドやGitHub issuesでバグを報告する
- 翻訳者になる
- フィードバック:メールでお知らせください
- **Penpotのコードにコントリビュート:**PenpotのCIO兼開発者であるAlejandro Alonsoによるこの動画では、Penpotのリポジトリを使用してフロントエンドとバックエンドの両方を変更する方法を実践的にデモしています
Penpotへのコントリビュートについて知る必要がある(ほぼ)すべてのことは、コントリビューティングガイドを参照してください。
リソース
質問や回答をしたり、自由な会話をしたり、プロジェクトに影響する決定をフォローしたりできます。
💾 ドキュメント
🚀 はじめに
✏️ チュートリアル
🏘️ アーキテクチャ
📚 開発日誌
ライセンス
This Source Code Form is subject to the terms of the Mozilla Public
License, v. 2.0. If a copy of the MPL was not distributed with this
file, You can obtain one at http://mozilla.org/MPL/2.0/.
Copyright (c) KALEIDOS INC
Penpotは Kaleidos のオープンソースプロジェクトです