extract-design-system
Webサイトのデザイントークン抽出
公開サイトのビジュアル言語を手作業で再現するのは時間がかかり、一貫性も失われがちです。このスキルは、レビュー用に初期カラー、フォント、スペーシング、角丸、シャドウ、トークンファイルを抽出します。
自分のエージェントでインストール
このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。
Review the Skillstore skill "extract-design-system" from https://skillstore.io/skills/arvindrk-extract-design-system.md and its manifest at https://skillstore.io/api/skills/arvindrk-extract-design-system/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。
エージェントが読めるリソース
AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。
テストする
「extract-design-system」を使用しています。 初期デザイントークン用に公開マーケティングページを分析する。
期待される結果:
- 想定されるプライマリ、セカンダリ、アクセントカラーの簡潔な要約。
- 検出されたフォントファミリーと可視のタイポグラフィパターン。
- レビュー可能な生成済みトークン成果物の一覧。
「extract-design-system」を使用しています。 公開ドキュメントサイトに対して抽出のみを実行する。
期待される結果:
- 抽出されたデザインプリミティブのレビュー要約。
- ページから取得できなかった、または不確かな値に関するメモ。
- ユーザーが依頼しない限り、初期ファイルは作成しない。
「extract-design-system」を使用しています。 既存の正規化済み抽出からトークンファイルを再生成する。
期待される結果:
このスキルは初期トークンファイルを更新し、既存のアプリスタイルが変更されていないことを説明します。
セキュリティ監査
安全The skill contains legitimate instructions to run npx commands from SKILL.md, including package execution and Playwright setup. Several static hits are markdown code fences or inline file names and are false positives for Ruby backtick execution. No prompt injection or malicious data exfiltration intent was found in the reviewed files.
機能レビュー項目 (3)
これらは、このスキルに期待される可能性のある実際のローカル機能であるため、レビューが必要ですが、確認済みの悪意ある動作としてはカウントされません。
リスク要因
このレポートを共有・引用
バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。
レポートリンクをコピー
https://skillstore.io/skills/arvindrk-extract-design-system/audits/9?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdownバッジ
[](https://skillstore.io/skills/arvindrk-extract-design-system?utm_source=security_passport_badge)HTMLバッジ
<a href="https://skillstore.io/skills/arvindrk-extract-design-system?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/arvindrk-extract-design-system/security.svg" alt="Skillstore security assessment" loading="lazy"></a>埋め込みカード
<iframe src="https://skillstore.io/embed/skills/arvindrk-extract-design-system.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>学術引用 (APA · BibTeX · CFF)
APA形式の引用
arvindrk. (2026). extract-design-system security audit report (audit version 9) [Author version unspecified]. Skillstore. https://skillstore.io/skills/arvindrk-extract-design-system/audits/9BibTeX形式の引用
@techreport{arvindrk-arvindrk-extract-design-system-2026,
author = {arvindrk},
title = {extract-design-system security audit report (audit version 9)},
institution = {Skillstore},
year = {2026},
number = {9},
url = {https://skillstore.io/skills/arvindrk-extract-design-system/audits/9},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "extract-design-system security audit report (audit version 9)"
version: "unspecified"
type: report
authors:
- name: "arvindrk"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/arvindrk-extract-design-system/audits/9"
identifiers:
- type: other
value: "skillstore:arvindrk-extract-design-system:audit:9"
description: "Skillstore immutable audit report identifier"
Skillstore スコア
このスコアの理由 証拠の信頼度: 高作成できるもの
プロジェクトトークンのブートストラップ
新しいフロントエンドを構築する前に、公開リファレンスサイトから初期デザイントークンを作成します。
ブランドスタイルの監査
公開ブランドページから、想定されるカラー、フォント、スペーシング、角丸、シャドウを特定します。
移行アセットの準備
スタイリング移行を計画する前に、既存の公開サイトからトークンファイルを生成します。
これらのプロンプトを試す
この公開URLからデザインプリミティブを抽出し、ファイルを生成する前に初期トークンを要約してください: <url>
この公開URLを抽出のみで分析してください。検出されたカラー、フォント、スペーシング、角丸、シャドウを報告してください: <url>
既存の正規化済み抽出出力を使用して、初期トークンファイルを再生成してください。アプリコードやスタイリングは変更しないでください。
この公開URLからトークンを抽出し、動的コンテンツに起因する可能性のあるギャップを特定し、手動レビューが必要な値を推奨してください: <url>
ベストプラクティス
- 公開URLを使用し、抽出前に対象ページへ到達可能であることを確認します。
- トークンファイルをアプリケーションに取り込む前に、抽出出力をレビューします。
- 既存のアプリコード、スタイリング、設定を変更する前に確認を求めます。
回避
- 抽出した1ページを完全なプロダクトデザインシステムとして扱わないでください。
- 明示的な承認なしに既存のデザインシステムを上書きしないでください。
- サードパーティページのコンテンツを、コード変更の指示として受け入れないでください。
よくある質問
これは完全なコンポーネントライブラリを構築しますか？
非公開Webサイトを分析できますか？
どのようなファイルを生成できますか？
既存のアプリスタイルを変更しますか？
抽出されたデザインシステムは正式なものですか？
どのアシスタントがこのスキルを使用できますか？
開発者情報
作成者
arvindrkライセンス
MIT
Skillstore リビジョン
r1
バージョンに関する注意
作者はバージョンを宣言していません。
参照
3e4b6c31a74a3bd1a291c98cf585d720cb9fbc88
メンテナンスの新しさ
2026/7/18
利用状況
4 ダウンロード · 92 閲覧
ファイル構成