Illustrator Html Design Skill
A 2026 Claude Code learning package for converting Adobe Illustrator designs into responsive, accessible HTML, CSS, and SVG implementations ready for browser development.
供給アセットの概要
コーディングと開発 Agent
コードレビュー、リポジトリ分析、テスト、CI、GitHub、DevOps、開発ワークフロー向けのスキルです。
シナリオ
コーディング Agent
リポジトリを理解し、コードを編集し、プルリクエストをレビューできるコーディング Agent が必要です。
Agent 適合
Claude Code + OpenAI Agents + Cursor
Codex、Claude Code、Cursor、CLI、またはカスタム Agent に対応します。
インストール
準備完了
npx skills add masonpsreed8378/illustrator-html-design-skill
メンテナンス
新しい
最終プッシュから 17 日
リスク
要レビュー
Low GitHub adoption signal
GitHub 品質
40
71/100 品質 · 78/100 信頼
対象タグ
レビュー注記
Low GitHub adoption signal · Quality score needs review
Agent 導入スコアカード
信頼、監査、インストール準備状況を一目で確認
公開リポジトリのメタデータ、OpenAgentSkill のレビューシグナル、保守の鮮度、インストール準備状況を組み合わせたスコアです。候補選定の目安であり、人によるレビューの代替ではありません。
品質
強い本番ワークフローの候補に値する堅実な選択肢です。
信頼
サンドボックス限定信頼シグナルが不足または混在する有用な候補です。結果ループがタスク適合を示すまで、隔離されたワークスペースで使用してください。
監査
要レビューインストール準備、安全メタデータ、保守、採用リスクの機械可読なレビュー。
OpenAgentSkill Trust Score v5
インストール前に人のレビュー
実作業で使う前に、サンドボックスでのみ実行し、近い代替と比較してください。
スター
GitHub スター 40
リポジトリ活動
スター 40、フォーク 0
メンテナンス
最終プッシュから 17 日
ライセンス
GPL-3.0
インストール
npx skills add masonpsreed8378/illustrator-html-design-skill
インストール安全性
標準パッケージまたはランタイムのインストールパス
権限範囲
network or browser access
Agent の成果
Agent の成果データはまだありません
ドキュメント
README/SKILL.md の文脈が十分です
リスク概要
本番前にレビュー
- Low GitHub adoption signal
- Quality score needs review
- GitHub adoption: 40 GitHub stars
- Stars/forks activity: 40 stars, 0 forks; issue activity unavailable in current metadata
インストール準備状況
インストールパスを利用可能
- インストールパスを利用できます
- リポジトリの根拠を利用できます
- ライセンスが明示されています
- Agent-Proven の成果エビデンスはまだありません
Agent 可読メタデータ
このスキルの機械可読な判断データ。
このブロックまたは埋め込み JSON を使い、Agent がこのスキルをインストールすべきか、代替を選ぶべきか、先に人のレビューを求めるべきかを判断できます。
適したタスク
- コーディング Agent ワークフロー
- Claude Code チーム
- builders willing to evaluate younger projects
- Inspect source files
適した Agent
インストール判断
- コマンド
- npx skills add masonpsreed8378/illustrator-html-design-skill
- ポリシー
- レビュー
- 人によるレビュー
- はい
信頼とリスク
- 信頼
- 70/100
- 監査
- 82/100
- リスクレベル
- 要レビュー
成果ループ
- エンドポイント
- /api/agent/outcome
- イベント ID
- resolve
- 成果
- 5
インストールコマンド
npx skills add masonpsreed8378/illustrator-html-design-skill使わない場合
- ベンダー提供の SLA が必要なチーム
- production agents without a repository review
- Low GitHub adoption signal
- Quality score needs review
- GitHub adoption: 40 GitHub stars
Agent セーフティ v2
66/100 · インストール前にレビュー
利用可能な候補ですが、Agent はインストール前に権限と監査メモを提示する必要があります。
実際のワークスペースへインストールする前に人の承認が必要です。
中
Browser automation
Skill may drive a browser or interact with web pages.
中
ネットワークアクセス
Skill はリモートページ、API、リポジトリ、外部サービスにアクセスする可能性があります。
- Low GitHub adoption signal
インストール先
Agent ワークフローにこのスキルをインストール
公開インストールエンドポイントからコマンド、安全チェックリスト、対象プロンプト、正規リンクを取得します。
OpenAgentSkill CLI
Resolve policy, run the source installer safely, and report a verified install receipt.
$ npx --yes https://github.com/Leon-Drq/openagentskill/releases/download/cli-v0.2.1/openagentskill-0.2.1.tgz install masonpsreed8378-illustrator-html-design-skillAgent 解決プラン
インストール前に Agent に適合性を検証させます。
Resolve API は第一候補、代替、安全ポリシー、監査メモ、インストール先、Agent がそのまま使えるプロンプトを返します。
JSON を開く
/api/agent/resolve?task=Use%20Illustrator%20Html%20Design%20Skill%20for%20an%20agent%20workflow&agent=codex&max_risk=medium
Resolve テキスト
/api/agent/resolve?task=Use%20Illustrator%20Html%20Design%20Skill%20for%20an%20agent%20workflow&agent=codex&max_risk=medium&format=text
インストール引き継ぎ
/api/skills/masonpsreed8378-illustrator-html-design-skill/install
Agent が確認すべきこと
- Resolve API でタスク適合と代替を確認。
- 監査・信頼スコアと安全ポリシーの警告を確認。
- Codex、Claude Code、Cursor、CLI のインストール先互換性を確認。
プロンプトをコピー
Task: Use Illustrator Html Design Skill in this workspace.
Resolve first: https://www.openagentskill.com/api/agent/resolve?task=Use%20Illustrator%20Html%20Design%20Skill%20for%20an%20agent%20workflow&agent=codex&max_risk=medium
Review install handoff: https://www.openagentskill.com/api/skills/masonpsreed8378-illustrator-html-design-skill/install
Install command: npx skills add masonpsreed8378/illustrator-html-design-skill
Before running it, summarize audit warnings, required permissions, and the fallback skill if install is risky.Agent 引き継ぎ
別のディレクトリではなく、インストール経路を Agent に渡します。
公開インストールエンドポイントからコマンド、安全チェックリスト、対象プロンプト、正規リンクを取得します。
インストール引き継ぎ
/api/skills/masonpsreed8378-illustrator-html-design-skill/install
LLM テキスト形式
/api/skills/masonpsreed8378-illustrator-html-design-skill/install?format=text
代替を探す
/api/skills/search?q=Illustrator%20Html%20Design%20Skill&limit=3
Agent プロンプト
Use Illustrator Html Design Skill for this task. Review https://www.openagentskill.com/api/skills/masonpsreed8378-illustrator-html-design-skill/install, then install with: npx skills add masonpsreed8378/illustrator-html-design-skillRegistry メタデータ
自動スキル選択用の Agent 可読プロファイル。
Registry API 経由で判断、信頼、監査、ユースケース、インストールのシグナルを提供し、UI をスクレイピングせずに Agent が順位付けできます。
Manifest
/api/registry/manifest/masonpsreed8378-illustrator-html-design-skill
LLM テキスト
/api/registry/manifest/masonpsreed8378-illustrator-html-design-skill?format=text
インストール別名
/api/registry/install/masonpsreed8378-illustrator-html-design-skill
推奨
/api/registry/recommend?task=Use%20Illustrator%20Html%20Design%20Skill%20in%20an%20agent%20workflow&limit=3
Agent 適合
コーディング Agent
プラットフォーム
HTML, Claude Code, OpenAI Agents, Cursor, Browser agents
Agent 判断パネル
Fallback candidate for Coding agents
まずこのスキルでプロトタイプを作り、代替候補を用意してください。
スタック内の役割
代替候補
主な適合
コーディング Agent
信頼ラベル
まずプロトタイプ
インストールパス
コマンド準備済み
使う場面
- コーディング Agent ワークフロー
- Claude Code チーム
- builders willing to evaluate younger projects
根拠
- 最近のリポジトリ活動
- インストールコマンドまたは GitHub リポジトリが利用可能
- 品質プロファイル 71/100
- OpenAgentSkill エンゲージメント 2 件
先にレビュー
- Low GitHub adoption signal
実装パス
- 1サンドボックスの Agent にインストールし、コーディング Agent タスクを一度最初から最後まで実行します。
- 2Compare output quality, latency, and failure behavior against at least one alternative.
- 3Promote it into production only after reviewing repository permissions, license, and maintenance signals.
信頼プロファイル
サンドボックス限定
信頼シグナルが不足または混在する有用な候補です。結果ループがタスク適合を示すまで、隔離されたワークスペースで使用してください。
GitHub 採用度
確認GitHub スター 40
スター／フォーク活動
確認スター 40、フォーク 0; 現在のメタデータでは Issue 活動を利用できません
最近のメンテナンス
合格最終プッシュから 17 日
ライセンスの明確さ
合格GPL-3.0
良いシグナル
- AI レビュー承認済み
- インストールパスを利用できます
- リポジトリの根拠を利用できます
- 最近保守されたリポジトリ
- インストールコマンドに明確な高リスクパターンはありません
- 成果ループは準備済みですが、最初の実行が必要です
インストール前にレビュー
- Low GitHub adoption signal
- Quality score needs review
- GitHub adoption: 40 GitHub stars
- Stars/forks activity: 40 stars, 0 forks; issue activity unavailable in current metadata
- 実際の Agent 成果レポートはまだありません
- 無人インストールの前に人によるレビューが必要です
推奨アクション
実作業で使う前に、サンドボックスでのみ実行し、近い代替と比較してください。
品質プロファイル
強い Agent ワークフロー向けの候補
本番ワークフローの候補に値する堅実な選択肢です。
ワークフロー適合
このスキルを使うシナリオ
Build and ship code
Coding agents
I need a coding agent that can understand a repository, edit code, and review pull requests.
Operate web apps
Browser automation
I need my agent to control a browser, fill forms, and verify web app workflows.
Manage repositories
GitHub automation
I need my agent to triage GitHub issues, review pull requests, and summarize repository changes.
ワークフロー適合
完全なワークフローに追加
Inspect, patch, and verify code
Coding review agent
A workflow for software agents that inspect repositories, review pull requests, generate tests, and turn findings into shippable patches.
Operate and verify web apps
Browser QA agent
A workflow for agents that navigate products, fill forms, take screenshots, and verify real user flows across web applications.
Design, build, test, and ship interfaces
Frontend and UI
A practical workflow for agents that turn product briefs or Figma designs into polished frontend code, review the result, test it in a browser, and prepare a safe deployment.
代替候補
インストール前に比較
このタスクに適する可能性のある類似スキル。
Khazix Skills
A collection of practical, installable AI agent skills for disk cleanup, AI news retrieval, and project management, following the Agent Skills standard.
Awesome Claude Skills
A curated list of resources and tools for enhancing Claude AI workflows.
Claude Scientific Skills
A comprehensive collection of ready-to-use scientific and research skills for AI agents.
概要
# Illustrator-to-HTML Skill - Web Development Education Package 2026
> **Illustrator-to-HTML Skill is a Claude Code learning package for turning Adobe Illustrator designs into responsive, accessible HTML, CSS, and SVG implementations ready for the browser.**
[](https://github.com) [](https://github.com) [](https://github.com) [](LICENSE) [](https://github.com/masonpsreed8378/illustrator-html-design-skill)
---
<p align="center"> <a href="https://masonpsreed8378.github.io/illustrator-html-design-skill/"> <img src="https://img.shields.io/badge/Download-Illustrator--to--HTML%20Skill%20Latest-brightgreen?style=for-the-badge" alt="Download Illustrator-to-HTML Skill"> </a> </p>
> **[Download Illustrator-to-HTML Skill](https://masonpsreed8378.github.io/illustrator-html-design-skill/)**
---
[Download Latest Build](https://masonpsreed8378.github.io/illustrator-html-design-skill/)
---
## About the Package
Illustrator-to-HTML Skill teaches a structured approach to using Claude Code when moving from Adobe Illustrator web layouts to functional HTML and CSS. It combines design exports, SVG and PNG resources, specifications, and browser output in a single implementation and review workflow.
The package supports learners, instructors, and developers seeking a consistent method for converting visual references into responsive interfaces. Its guidance covers page structure, maintainable code, accessibility, and visual checks across PC, tablet, and smartphone views.
---
## What It Provides
- Turn Illustrator web compositions into practical
プラットフォーム互換性
技術詳細
- バージョン
- 1.0.0
- ライセンス
- GPL-3.0
- 最終更新
- 2026年8月18日
- 公開日
- 2026年8月5日
フレームワークとツール
判断の要約
代替候補
最近のリポジトリ活動
Agent 実証エビデンス
Agent 実証エビデンス
Resolve、レビュー、インストール、限定実行後の成果レポート。
- 成功率
- —
- 直近の失敗
- —
- 成果
- 0
- 出力品質
- —
- 失敗
- 0
- 非該当
- 0
- インストール数
- 0
- リスクによりブロック
- 0
- 設定が必要
- 0
- 本番
- 0
Agent の実行結果はまだありません。最初の実行では /api/agent/outcome を通じて成功、設定要件、リスクによるブロック、失敗、非該当を報告できます。
成長ループ
共有キット
Illustrator Html Design Skill 用のシナリオベース草案です。X へ手動投稿できます。
Illustrator Html Design Skill: A 2026 Claude Code learning package for converting Adobe Illustrator designs into responsive,... 40 stars https://www.openagentskill.com/skills/masonpsreed8378-illustrator-html-design-skill?ref=x
任意：インストールコマンド付きの返信
Listing + install path for Illustrator Html Design Skill: https://www.openagentskill.com/skills/masonpsreed8378-illustrator-html-design-skill?ref=x Install: npx skills add masonpsreed8378/illustrator-html-design-skill
掲載元
コミュニティにより登録
この掲載は公開ソースから登録されており、メンテナー申請が承認されるまで公式として表示されません。
- インデックス作成者
- OpenAgentSkill コミュニティインデックス
帰属は公開リポジトリまたは作成者プロフィールにリンクされています。作成者は掲載を申請して所有権シグナルを更新できます。
このスキルを申請所有者の申請
このスキル掲載を申請
この コミュニティにより登録 掲載は masonpsreed8378 に帰属していますが、まだ公式として表示されていません。申請すると、確認済み所有者シグナルが追加され、今後の公開、インストール、監査更新の信頼性が高まります。
クリエイター被リンクキット
README にエビデンスバッジを追加
開発者がリポジトリを評価する場所で、正規掲載、現在の信頼・監査シグナル、実際の Agent-Proven エビデンスを表示します。
[](https://www.openagentskill.com/skills/masonpsreed8378-illustrator-html-design-skill)
[](https://www.openagentskill.com/skills/masonpsreed8378-illustrator-html-design-skill)
[](https://www.openagentskill.com/skills/masonpsreed8378-illustrator-html-design-skill/audit)
[](https://www.openagentskill.com/skills/masonpsreed8378-illustrator-html-design-skill)作者
masonpsreed8378
@masonpsreed8378
健全性シグナル
- GitHub スター
- 40
- 品質スコア
- 43/100
- 最終 GitHub プッシュ
- 2026年8月4日
- フレームワークのヒント
- 1
- OpenAgentSkill 閲覧数
- 2
- インストールコピー数
- 0
- 外部クリック
- 0
コミュニティシグナル
このスキルが Agent ワークフローに役立つかを共有してください。集約されたフィードバックがランキングを改善します。
信頼と安全性
サンドボックス限定
- GitHub 採用度GitHub スター 40確認
- スター／フォーク活動スター 40、フォーク 0; 現在のメタデータでは Issue 活動を利用できません確認
- 最近のメンテナンス最終プッシュから 17 日合格
- ライセンスの明確さGPL-3.0合格
- README/SKILL.md の完全性メタデータには十分な利用・ワークフロー文脈があります合格
- 依存関係／ランタイムのリスクnetwork or browser surface合格
関連スキル
Khazix Skills
A collection of practical, installable AI agent skills for disk cleanup, AI news retrieval, and project management, following the Agent Skills standard.
19.6K スターAwesome Claude Skills
A curated list of resources and tools for enhancing Claude AI workflows.
65.9K スターClaude Scientific Skills
A comprehensive collection of ready-to-use scientific and research skills for AI agents.
31.2K スター