厳選・オープン・無料

Merit

エディトリアルなレイアウトを持つ、ミニマルでプレミアムなビューティーブランド。

01

デザイン DNA

精査されたマガジンの見開き

02

カラー

ホワイトを基調としたハイコントラストのブラックに、温かみのある柔らかなグレーを加える。

03

タイポグラフィ

didone-serif · grotesque-sans

• display48px · 400
• subtitle13px · 400
• body16px · 400

ディドーネ・セリフをエレガントなディスプレイ見出しに · クリーンなグロテスク・サンセリフをナビゲーションと本文に · ラベルには大文字とトラッキング

04

余白

ゆったりとした

05

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

プライマリボタンには1px solid black

06

レイアウト

スプリットスクリーンのヒーロー、コンテンツ用の標準グリッド

07

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

画像には滑らかなopacityとtransformのフェード · インタラクティブな状態には繊細なリニアトランジション

控えめなopacityの軽減 · 標準ポインタ

08

コンポーネント

• button 控えめな、テキストベースのCTAまたは純黒のボタン
• card ボーダーレスで、端から端まで広がる画像
• input シンプルなアンダーラインまたは最小限のボーダー
• hero 大型画像とセリフ見出しへのフルワイド・エディトリアル・スプリット

09

文体と禁止事項

• トーン 洗練されていて、率直な
• 見出し 短く、想起を喚起するセリフフレーズ
• CTA ミニマルで行動を促す

• 明るいネオンカラーは使わない — パレットは黒、白、そして柔らかな温みのあるグレーに厳密に限定する。
• 角を大きく丸めない — デザインはシャープか、非常に控えめな角を好む。
• ディスプレイ見出しにサンセリフを使わない — プライマリな見出しスタイルはエレガントなディドーネ・セリフである。
• レイアウトを雑然とさせない — 広めの余白と余裕を確保する。
• プライマリ要素にドロップシャドウを使わない — デザインはフラットで、階層構造はタイポグラフィに依存する。
• 本文を全て大文字にしない — これは短い大文字ラベルとナビゲーションに限定される。
• 避ける: 感嘆符
• 避ける: 営業用語
• 避ける: ごちゃごちゃしたUI

10

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

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

11

System Prompt

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