pencil-to-code

| frame with layout | | | frame with children | Component with children | | text | , , or | | ref (instance) | Reusable component | | rectangle | with fill | | ellipse | | | image | or fill: url() |

.pen デザインを React/Tailwind コードにエクスポートします。一つのことをうまくやります。 入力: .pen フレーム ID またはファイル パス 出力: React コンポーネント コード + Tailwind 構成 次の場合に使用します: 設計の検討またはユーザーが実装コードを必要とする場合 完成した鉛筆デザインから。 ソース: elementsai-dev/cognia。

ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/elementsai-dev/cognia --skill pencil-to-code インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります

安全認証済み、信頼性の高いコード ワンクリックインストール、簡単設定 Claude Code、Cursor、OpenClaw などに対応