Together AI のウェブデザインスキル:エージェントに対して、譲れない最低限のルール(16 条)を定めています。具体的には、色やフォントはトークン経由で指定し、データやレビューを捏造せず、ファーストビューにタイトルと主要ボタンを配置するなどが含まれます。テーマライブラリから3つの方向性を提示し、その中から1つを選択して構築した後、sloplint をブラウザ内で実行して違反がないか確認してから納品します。
skills.sh のインストール数 74901(+2635 / 24時間)
セキュリティ監査:リスクに関する注意喚起あり
- スキャンされていないスクリプトが参照されています:scripts/sloplint.mjs、scripts/capture.mjs、scripts/theme.mjs
- 監査範囲:GitHub の nutlope/hallmark/skills/hallmark/SKILL.md(SKILL.md のテキストのみをスキャン)
理由
- 最低限のルールは具体的な CSS に落とし込まれています。
transition: allは使用せず、width/height/top/leftのアニメーションは行わず、htmlとbodyにはoverflow-x: clipを適用し、インタラクティブな要素にはすべて:focus-visibleを設定し、アニメーションにはすべてprefers-reduced-motionへのフォールバックを用意しています。 - 作業開始前に、素材、対象読者、ページで促したいアクション、トーンという4つの事項についてのみ一度質問します。提供されていない数値、引用、ロゴはすべて空白のままにし、エージェントによる捏造を許しません。
theme.mjsはプロンプトに基づいて3つのテーマを提示し、ログを記録することで、連続して同じデザインにならないようにします。作者によれば、テーマライブラリには 50 種類のマテリアル、写真ライブラリには 755 枚のオープンライセンス写真が含まれており、使用時にはフッターにクレジットを記載します。- skills.sh では 24 時間で 2635 件のインストールがあり、累計は 74901 件です。直近1週間は 6181 件で、過去数週間は2000件台でした(これはあくまで注目度を示すものです)。
使い方
npx skills add https://github.com/nutlope/hallmark --skill hallmarkでインストールします(作者の README ではnpx skills add nutlope/hallmark -gでグローバルインストールする例が示されています)。Claude Code プラグインも利用可能です。- 新しいページを作成する際は、要件を直接記述します。既存のページを変更する場合は、
/hallmark redesign <パス>や/hallmark audit <パス>のように明示的に指定します。 - Node 18 以上が必要です。ブラウザでのチェックとスクリーンショット撮影には、別途
npm i -g puppeteer-coreと Chrome が必要ですが、これらが利用できない場合は静的チェックのみが実行されます。
リスク
- 監査で指摘された
sloplint.mjs、capture.mjs、theme.mjsの3つのスクリプトはスキャンされていません。SKILL.md ではエージェントがこれらを Node で実行するよう指示しており、capture.mjsはユーザーのプロダクト URL や開発サーバーを開いてスクリーンショットを撮影します。これは用途と一致しています。 - 写真ライブラリには Wikimedia Commons へのリンクのみが保存されており、画像ファイル自体は含まれていません。使用時にはネットワーク経由で画像を取得する必要がありますが、スキャン結果にはこのネットワーク接続に関する項目は個別に列挙されていません。
- ワークフローでは複数の参照ファイルを読み込み、複数回のレビューを行う必要があります。作者も、ファイルの追加読み込みが最も回避可能なコストであることを明記しています。