厳選・オープン・無料

Moderne St

クリエイティブチームに高度にカスタマイズされた広告アイデアとインサイトを提供するデジタルワークスペース。

01

デザイン DNA

広告チームのための、活気のあるイラスト付きクリエイティブスタジオ。

02

カラー

温かみのあるオフホワイトの背景、深いインディゴのセクション、明るいコーラルのアクセントのコントラスト。

03

タイポグラフィ

humanist-sans · transitional-serif

• display56px · 500
• body16px · 400

インパクトのある large-scale display text には humanist sans-serif を使用する。 · 本文や詳細な説明には transitional serif を使用する。 · large display text と標準的な本文の間に明確なタイポグラフィ階層を維持する。

04

余白

異なるコンテンツセクションを分離するための大きなパディングブロックを備えた、豊かな垂直スペーシング。

05

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

アウトライン付きカードやボタンに使用する、薄い2pxのボーダー。

06

レイアウト

プロミネントなヒーローセクションに続く、標準的なレスポンシブレイアウト。

07

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

ボタンや色の変化などのUI要素に、迅速な0.15秒のトランジション。

インタラクティブな要素への、迅速な0.15秒の色のトランジション。 · クリックに対する即座のレスポンス。

08

コンポーネント

• button 白字のコーラル塗りつぶしボタンと、ピル型の「Get a Demo」バリアント。
• card テキストやイラストを含む、細いボーダーと角丸のカード。
• hero 左側にダーク背景の大切なテキスト、右側にカラフルなイラストを配置した分割ヒーロー。

09

文体と禁止事項

• トーン プロフェッショナルで、インスピレーションを与え、少し遊び心のあるトーン。
• 見出し 大きくインパクトがあり、クリエイティブな能力の開発に焦点を当てたもの。
• CTA 「Get Started」のような、直接的でアクション志向のもの。

• フラットな白い背景を使用しない — スクリーンショットではコンテンツセクションに温かみのあるオフホワイト (#F3EAE5) が使用されている。
• ダークセクションに明るいプライマリカラーを使用しない — スクリーンショットでは深いインディゴ (#171C5D) が使用されている。
• アクセントカラーに明るい赤を使用しない — スクリーンショットでは柔らかなコーラル (#FF7E85) が使用されている。
• 本文に純粋に幾何学的な sans-serif フォントを使用しない — スクリーンショットでは transitional serif が使用されている。
• UI要素に強く丸みのある角を使用しない — スクリーンショットでは微妙な4pxのborder-radiusが使用されている。
• カード要素にドロップシャドウを使用しない — スクリーンショットでは代わりに薄いボーダーを使用したフラットデザインが使用されている。
• 避ける: 専門用語の多用
• 避ける: 乾いた、あまりに企業的なトーン

10

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

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

11

System Prompt

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