厳選・オープン・無料
Aplos
リッチなダークな映像と洗練されたセリフ書体を特徴とする、洗練された植物由来飲料のプレミアムD2Cブランド。
ConsumerPhotographicPremiumCleanProduct
01
デザイン DNA
ノンアルコール洗練植物由来ウェルネス
ゼロスピリッツのための、モダンでラグジュアリーなアポセカリーのような存在。
02
カラー
#000000Ink
#646464Ink soft
#F2F1EDBG soft
rgba(180,174,172,1)Line
読みやすさと焦点を高めるための、暖かみのあるオフホワイト面を加えた、高コントラストのモノクローム基盤。
03
タイポグラフィ
transitional-serif · humanist-sans
- display
40px · 400 - subtitle
26px · 400 - body
13px · 400
04
余白
3pxの厳密な倍数を基調とし、12pxと24pxをプライマリガターとして使用。
05
サーフェス (角丸 / 影 / 罫線)
sm · 3px
md · 5px
lg · 12px
pill · 999px
入力フィールドやコンテナを定義するための、繊細な1pxボーダーとインセットボックスシャドウ。
rgb(180, 174, 172) 0px 0px 0px 1px inset
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
大きなセンタリングされたモーダルオーバーレイを含む、フルブリードのダークヒーロー。
07
モーションとインタラクション
200msmicro
300mssmall
800msmedium
cubic-bezier(0.645, 0.045, 0.355, 1)easing
インタラクティブ要素向けの、滑らかな背景とカラーのトランジション · フィルとホバーステートのためのトランスフォームアニメーション
インタラクティブ要素に対する、繊細なカラーと背景のトランジション。 · 標準的なポインターカーソルによる、即座のビジュアルレスポンス。
08
コンポーネント
- button プライマリアクション向けの、白文字を用いたハイコントラストなブラックのピル型、または大きな角丸ボタン。
- card 片側にシネマティックな画像、もう片側にクリーンで機能的なフォームを持つ分割ビューモーダル。
- input 繊細な1pxのインセットボックスシャドウと、少し丸みのある角を持つクリーンなテキスト入力欄。
- hero 大規模な写真ヒーロー。雰囲気のあるライティングとオーバーレイの書体を採用。
09
文体と禁止事項
- トーン 洗練され、自信があり、かつ歓迎的なトーン。
- 見出し 字間を詰めた、大きな洗練されたセリフ書体の見出し。
- CTA 「今すぐ購入」や「続ける」のような、直接的でアクション指向のコピー。
- 明るいアクセントカラーを使用しない — スクリーンショットは厳密な黒、白、オフホワイトのパレットを示しています
- 大きな角丸のボタンを使用しない — スクリーンショットはより洗練された、モダンな5pxの角丸を示しています
- ディスプレイ用に一般的なサンセリフフォントを使用しない — スクリーンショットはすべての主要見出しにトランジショナル・セリフを使用しています
- 雑踏感のある、複数カラムのレイアウトを使用しない — スクリーンショットはクリーンで焦点の絞られた分割ビューモーダルとフルブリードヒーローを示しています
- メインサイトの背景に明るく軽やかな色を使用しない — スクリーンショットは支配的なダークブラックの背景を示しています
- アグレッシブなドロップシャドウを使用しない — スクリーンショットは定義付けのための繊細なインセットボックスシャドウとボーダーを示しています
- 避ける: 派手なネオンカラー
- 避ける: 遊び心のある、あるいは過度にカジュアルな言葉遣い
- 避ける: 雑踏感のある、散らかったレイアウト
- 避ける: 一般的なサンセリフの見出し
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
このデザインは、ゼロスピリッツを専門とする、プレミアムなD2C飲料ブランドを表しています。深みのあるブラック(#000000)と暖かみのあるオフホワイト(#F2F1ED)の面に支配された、洗練されたミニマルな美学を活用しています。書体は、ディスプレイ用の洗練されたトランジショナル・セリフと、ボディやUI要素用のクリーンなヒューマニスト・サンスが基盤です。重要なインタラクションパターンには、ハイコントラストで大きな角丸のプライマリボタンや、フォームフィールドのための繊細なインセットボーダーが含まれます。重要な制約:鮮やかなアクセントカラーを厳密に避け、見出しに決して一般的なサンセリフを使用せず、控えめで写真重視のレイアウトを維持すること。
en · zh-CN · zh-TW · ja · ko