厳選・オープン・無料

Vibrants

ソフトなグラデーション背景とカラフルで親しみやすいボタンを備えた、遊び心のあるウェルネス重視のランディングページ。

01

デザイン DNA

カラフルでエネルギッシュ、かつ穏やかな雰囲気であなたを迎えるフレンドリーなウェルネスブランド。

02

カラー

ソフトで明るい背景に、ハイコントラストのテキストとカラフルなアクセントを配置。

03

タイポグラフィ

humanist-sans

• display48px · 700
• body16px · 400

04

余白

垂直間隔は一定で、4pxの倍数を使用。

05

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

1px solid

rgba(0, 0, 0, 0.1) 0px 2px 4px 0px

06

レイアウト

十分な垂直間隔を備えた中央揃えのカラムレイアウト。

07

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

ボタンに微細な透明度の変化を適用。 · ボタンの押下効果。

08

コンポーネント

• button 角丸の大きなアウトラインボタンで、各アクションに異なるカラーを割り当て。
• hero ロゴ、見出し、サブテキスト、および縦に積み重ねられたアクションボタンを備えた中央揃えレイアウト。

09

文体と禁止事項

• トーン フレンドリー
• 見出し 遊び心と励ましを含んだスタイル。
• CTA 直接的でアクション重視のスタイル。

• スクリーンショットに示されているように、真っ白な背景は使用しない（ソフトなパステルグラデーション背景を採用）。
• スクリーンショットに示されているように、単一のアクセントカラーは使用しない（カラフルなボタンを使用）。
• スクリーンショットに示されているように、ボタンに鋭い角は使用しない（角丸長方形を採用）。
• スクリーンショットに示されているように、小さく密集したテキストは使用しない（十分な間隔と大きなタッチターゲットを確保）。
• スクリーンショットに示されているように、ダークテーマは使用しない（明るく軽やかなデザインを採用）。
• スクリーンショットに示されているように、厳格なグリッドレイアウトは使用しない（中央揃えの縦積みレイアウトを採用）。
• 避ける: フォーマル
• 避ける: テクニカル
• 避ける: アグレッシブ

10

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

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

11

System Prompt

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