Siteprint

概要

• Safari上であらゆるWebページのデザインを分析し、色・文字・余白・角の丸み・レイアウトを具体的な数値として抽出できます。
• 抽出結果をClaude Code、Cursor、CodexなどのAIエージェント向けプロンプトにまとめ、推測ではなく実測値をもとに実装へつなげられます。

主な特徴

• 色には用途や役割、文字にはサイズ・太さを含むタイポグラフィのスケール、各セクションにはレイアウトの設計図を付与します。
• Apple Intelligence対応Macでは、スキャン結果の印象や採用・回避すべきデザイン要素をオンデバイスで分析できます。
• 無料のInspectに加え、ProではDESIGN.md、テーマ、MCP連携、2サイトを融合するCompose機能を利用できます。

こんな人におすすめ

• Safariを普段使いし、ブラウザを切り替えずに参考サイトのデザインを調査して、制作中のWebサイトへ活用したい人に適しています。
• AIコーディングツールを使っており、曖昧なデザイン指示ではなく、実際の寸法や構造を含むプロンプトで実装したい開発者向けです。
• 競合サイトや参考デザインを保存・比較しながら、既存サイトのスタイルを組み合わせて新しいUIの方向性を検討したい人にも役立ちます。