Communitygithub.com

se7en-claude/se7en-clip

このスキルを使用すると、se7en(ダウンロード&アップスケールツール)用のブランド化されたインターフェースやアセットを生成できます。プロトタイプやモックアップなど、本番用から簡易的なものまで対応します。デザインガイドライン、カラー、タイポグラフィ、フォント、アセット、UIキットコンポーネントが含まれています。

se7en-clip とは?

このスキルは、「se7en(ダウンロード&アップスケール)」プロダクト向けのブランド化されたUIやビジュアルアセットを迅速に生成するために設計されています。デザインガイドライン、カラーパレット、タイポグラフィ、フォント、各種アセット、そしてプロトタイピング用のUIキットコンポーネントを備えており、開発者やデザイナーが一貫したブランド体験を短時間で実現できるよう支援します。Claude CodeやCursorなどのAIエージェントと連携し、静的なHTMLアーティファクト(プレゼンテーション用スライドやモックアップ、簡易プロトタイプ)の作成、あるいは本番コードへの直接的なアセット組み込みの両方に対応します。このスキルが呼び出されると、エキスパートデザイナーとして振る舞い、ユーザーの目的に応じて最適な出力形式(HTMLアーティファクトか本番コードか)を提案します。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/se7enclaude/se7en-clip/tree/HEAD/design-system

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

このスキル内の readme.md ファイルを読み、他の利用可能なファイルを確認してください。

ビジュアルアーティファクト(スライド、モックアップ、簡易プロトタイプなど)を作成する場合は、アセットをコピーしてユーザーが閲覧できる静的HTMLファイルを作成してください。本番コードに取り組む場合は、アセットをコピーし、ここにあるルールを読んでこのブランドを使ったデザインの専門家になってください。

ユーザーが他の指示なしにこのスキルを呼び出した場合は、何を作成またはデザインしたいかを尋ね、いくつか質問をした上で、エキスパートデザイナーとして振る舞い、必要に応じてHTMLアーティファクトまたは本番コードを出力してください。

関連スキル