厳選・オープン・無料

Bolt

自然言語でアプリやウェブサイトを作成できる、モダンなダークテーマのAIプラットフォーム。

01

デザイン DNA

開発者向けのAIを活用したクリエイティブスタジオ。

02

カラー

単一の鮮やかなブルーアクセントを用いた、ハイコントラストのダークモード。

03

タイポグラフィ

humanist-sans · monospace

• display56px · 700
• heading48px · 600
• body16px · 400
• small14px · 400

04

余白

4pxの刻みを一貫して使用し、16pxおよび24pxをプライマリガターとして採用。

05

サーフェス (角丸 / 影 / 罫線)

1px solid rgba(255, 255, 255, 0.1)

0px 1px 2px 0px rgba(0, 0, 0, 0.05) · 0px -15px 24.8px 0px rgba(17, 114, 226, 0.6)

06

レイアウト

固定された最大幅を持つ、中央揃えのコンテンツ。

07

モーションとインタラクション

インタラクティブ要素のカラートランジション · ホバーおよびフォーカス時の不透明度フェード

微細なカラー変化または不透明度の変更。 · 即座のビジュアルレスポンス。

08

コンポーネント

• button プライマリアクションはソリッドブルー、セカンダリアクションはゴースト。角丸はピルまたは小半径。
• card 微細なボーダーとソフトシャドウを持つ、ダークサーフェス。
• chip タグやツール用の、アウトラインまたは最小限の背景。
• input ソフトボーダーと微細な内側シャドウを持つ、ダークテキストエリア。
• hero 発光するブルーのカーブグラデーション背景を用いた、中央揃えの大型タイポグラフィ。

09

文体と禁止事項

• トーン 直接的、賦権的、モダン。
• 見出し 質問志向でアクションドリブン。
• CTA 明確かつ命令的。

• 明るい背景を使用しないこと — スクリーンショットは厳格なダークモードインターフェースを示しています
• セリフフォントを使用しないこと — スクリーンショットはモダンなヒューマンサンセリフを一貫して使用しています
• 重いドロップシャドウを追加しないこと — スクリーンショットは最大でも微細でソフトなシャドウを示しています
• 多様な色を使用しないこと — スクリーンショットはダークグレー、白、および単一の鮮やかなブルーからなる厳格なパレットを示しています
• 鋭角の角を使用しないこと — スクリーンショットは一貫して角丸およびピル形状を示しています
• 低コントラストのテキストを使用しないこと — スクリーンショットはダーク背景上のハイコントラストの白文字を示しています
• 避ける: 技術用語
• 避ける: フォーマルな企業言語
• 避ける: 過度に複雑な文

10

パック内の実スクリーンショット

実ページから取得 · 実 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko