How It Design のアイテムロゴ画像

How It Design

How It Design のアイテム メディア 2 のスクリーンショット
How It Design のアイテム メディア 1 のスクリーンショット
How It Design のアイテム メディア 2 のスクリーンショット
How It Design のアイテム メディア 1 のスクリーンショット
How It Design のアイテム メディア 1 のスクリーンショット
How It Design のアイテム メディア 2 のスクリーンショット

概要

現在のウェブページから Google Stitch 互換の DESIGN.md を生成します。

How It Design は、現在のウェブページを Google Stitch 互換の `DESIGN.md` ファイルに変換し、デザイナーや開発者がデザインシステムをより素早く把握できるようにします。🎯 🚀 機能: 1. 現在のページから、レイアウト、色、タイポグラフィ、スクリーンショットなどの視覚的な情報を抽出します。 2. 自分で設定したマルチモーダル AI プロバイダーを使って、構造化された `DESIGN.md` を生成します。 3. 生成されたデザインドキュメントをプレビュー、コピー、保存、ダウンロードできます。 4. 出力をローカルで検証し、必要に応じて生成をリトライします。 5. ローカルファースト BYOK: API キーはブラウザーのストレージに保存され、選択したプロバイダーにのみ送信されます。 💡 こんな用途に最適: 1. 既存のウェブページから UI スタイルを再現する。 2. プロダクトのデザインシステムをドキュメント化する。 3. AI ツール、デザイナー、フロントエンドエンジニアへデザインコンテキストを引き継ぐ。

詳細

  • バージョン
    0.9.2
  • 更新:
    2026年6月22日
  • 提供元
    mambahj24
  • サイズ
    373KiB
  • 言語
    2 言語
  • デベロッパー
    メール
    mambahj24@gmail.com
  • 非取引業者
    このデベロッパーは取引業者として申告していません。EU 加盟国の消費者とこのデベロッパーとの間に締結された契約には、消費者の権利が適用されません。

プライバシー

拡張機能を管理し、組織での使用状況を確認できます
デベロッパーは、お客様のデータを収集または使用しないことを表明しています。

このデベロッパーは、お客様のデータについて以下を宣言しています

  • 承認されている以外の用途で第三者に販売しないこと
  • アイテムの中心機能と関係のない目的で使用または転送しないこと
  • 信用力を判断する目的または融資目的で使用または転送しないこと

関連アイテム

AI Design Taste - DESIGN.md and SKILL.md Generator

5.0

Analyze page styling and produce DESIGN.md or SKILL.md documentation compatible with Kiro, Claude, Codex, and Cursor.

DesignDNA

0.0

Extract any website's design system into a markdown file for AI coding agents.

DESIGN.md Style Extractor - TypeUI

5.0

Extract page styles and generate DESIGN.md or SKILL.md files and use it with Google Stitch, Claude, Codex, and Cursor.

DESIGN.md Inspector

5.0

Auto-generate DESIGN.md and SKILL.md from any page's design system and use it with Claude, Codex and Cursor.

DESIGN.md Generator

5.0

Extract any website's design system as DESIGN.md or SKILL.md — feed to Claude Code, Cursor, or Codex.

Google Drive Markdown Preview

4.0

Automatically renders markdown files in Google Drive preview mode

Extrator de DESIGN.md

5.0

Extrai design tokens de qualquer página e gera um arquivo DESIGN.md (W3C DTCG) no padrão Google.

Copy to Design - Webからデザインへ

5.0

Webページの要素を取得し、Figma、MasterGo、Axure などのデザインツールへコピーします。

Drive HTML Preview

5.0

Renders HTML files stored in Google Drive as web pages instead of showing their source code.

Design System Extractor

4.5

Extracts the design system of the current website into an AI-friendly markdown document.

Over.fig – Compare design to website in real time

4.6

Bridge the gap between design and code. Convert your Figma into a pixel-perfect semi-transparent overlay directly on your web page.

GreatPages — Capturar Design System

5.0

Copie o design system de qualquer site para o GreatPages.

AI Design Taste - DESIGN.md and SKILL.md Generator

5.0

Analyze page styling and produce DESIGN.md or SKILL.md documentation compatible with Kiro, Claude, Codex, and Cursor.

DesignDNA

0.0

Extract any website's design system into a markdown file for AI coding agents.

DESIGN.md Style Extractor - TypeUI

5.0

Extract page styles and generate DESIGN.md or SKILL.md files and use it with Google Stitch, Claude, Codex, and Cursor.

DESIGN.md Inspector

5.0

Auto-generate DESIGN.md and SKILL.md from any page's design system and use it with Claude, Codex and Cursor.

DESIGN.md Generator

5.0

Extract any website's design system as DESIGN.md or SKILL.md — feed to Claude Code, Cursor, or Codex.

Google Drive Markdown Preview

4.0

Automatically renders markdown files in Google Drive preview mode

Extrator de DESIGN.md

5.0

Extrai design tokens de qualquer página e gera um arquivo DESIGN.md (W3C DTCG) no padrão Google.

Copy to Design - Webからデザインへ

5.0

Webページの要素を取得し、Figma、MasterGo、Axure などのデザインツールへコピーします。

Google アプリ