厳選・オープン・無料

Blu Dot

大胆でクリーンな美学を備えた、モダン家具およびホームグッズ。

01

デザイン DNA

建築的な精度をもって提示された、モダンな生活用品のキュレーションされたギャラリー。

02

カラー

単一の高エネルギーなレッドアクセントで区切りをつける、クリーンな白と黒の基盤。

03

タイポグラフィ

geometric-sans · humanist-sans

• display70px · 700
• body14px · 400

見出しは大文字で、字間は詰められています。 · 本文は通常のウェイトで、非常に高い可読性を備えています。 · テキストカラーは強調のために、純黒とアクセントレッドを交互に使用します。

04

余白

編集上の明瞭さのために十分な余白を確保した、一貫した4pxグリッド。

05

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

入力欄には1px solid rgba(160, 160, 160, 1)、標準要素にはsolid black。

rgba(0, 0, 0, 0.2) 0px 0px 18px 0px

06

レイアウト

デスクトップではフル幅の分割画面レイアウト、モバイルでは縦に積み重ねます。

07

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

UIステート変化のためのスムーズなオパシティトランジション。 · インタラクティブ要素の微細なカラー変化。

即座のバックグラウンドまたはテキストカラーの変化。 · 重いスケーリング効果のない、標準のポインターカーソル。

08

コンポーネント

• button フル幅、ソリッドレッド、太字の大文字の白テキスト。
• card クリーンなエッジ。主に高品質なフォトグラフィで定義されます。
• chip ピル型バッジ。フィルターによく使用されます。
• input 細い1pxボーダーを持つ、ミニマルな長方形フィールド。
• hero 大胆でカラフルなライフスタイルフォトグラフィと組み合わせた、大規模なタイポグラフィレイアウト。

09

文体と禁止事項

• トーン 直接的、自信、そして温かみのある。
• 見出し 短く、力強く、大文字のフレーズ。しばしば言葉遊びを用います。
• CTA 明確かつ取引的。例：「CONTINUE」や「SHOP」。

• 装飾的なセリフ書体を使用しない — スクリーンショットではクリーンな幾何学サンセリフおよびヒューマニストサンセリフフォントが使用されています。
• グラデーションを使用しない — スクリーンショットではアクセントにソリッドなフラットなカラーブロックが使用されています。
• メインボタンに角丸を使用しない — スクリーンショットではシャープで長方形のボタン形状が使用されています。
• ダークモードを使用しない — スクリーンショットではプライマリコンテンツエリアに明るい白い背景が使用されています。
• 落ち着いた、低コントラストなカラーを使用しない — スクリーンショットではハイコントラストな黒とレッドのアクセントが使用されています。
• 複雑なシャドウを使用しない — スクリーンショットでは、単一の微細なシャドウインスタンスのみを用いたフラットデザインが使用されています。
• 避ける: ごちゃごちゃしたレイアウト
• 避ける: 落ち着いた、または複雑なカラーパレット
• 避ける: セリフ書体

10

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

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

11

System Prompt

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