厳選・オープン・無料

6Am Glass

アグレッシブなスケールと極端なスペーシングを備えた、ハイコントラストでタイポグラフィ中心のデザインシステム。

01

デザイン DNA

テキストが彫刻となるブータリズムのギャラリーエキシビション。

02

カラー

最大コントラストによる厳格なモノクローム。

03

タイポグラフィ

grotesque-sans

• display72px · 400
• body15px · 400
• caption14px · 400

すべてのタイポグラフィは、インパクトを高めるため大文字で統一されます。 · 大きなテキストブロックを収縮させるため、 tightened negative letter-spacing を使用します。 · 極端なline-heightにより、密度の高い建築的なテキストブロックを形成します。

04

余白

不規則かつ非対称。大きな、劇的な隙間を優先します。

05

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

ボタンなどの機能要素にのみ厳格に使用される、1pxの実線黒ボーダー。

rgba(0, 0, 0, 0.15) 0px 0px 0px 1px

06

レイアウト

テキストブロックが対角をアンカーとする、密で非対称なグリッド。

07

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

繊細なフェード · 瞬時のトランジション

テキストリンクではカーソルはポインタのまま。目立つスタイル変更はありません。 · 直接的で即座です。

08

コンポーネント

• button tight, アップパークロールのラベルを持つミニマリストなアウトライン矩形。
• card 提供されたスクリーンショットでは確認できません。
• chip 提供されたスクリーンショットでは確認できません。
• input 提供されたスクリーンショットでは確認できません。
• hero 非対称な整列と極端なスケールを用いた、巨大なタイポグラフィによる声明。

09

文体と禁止事項

• トーン 直接的、権威的、そして無言。
• 見出し 巨大でアグレッシブ、建築的。
• CTA 繊細かつ機能的。しばしば小さなピルやリンクとして提示されます。

• カラーアクセントを使用しないこと — スクリーンショットは厳格なモノクロームパレットを示しています
• 柔らかく丸みのある形状を使用しないこと — スクリーンショットは鋭い幾何学的エッジを示しています
• 装飾的なセリフフォントを使用しないこと — スクリーンショットは太字で工業的なゴシック体を示しています
• 大きなテキストブロックをセンタリングしないこと — スクリーンショットは極端な左揃え、右揃え、非対称な整列を示しています
• bodyに余裕のあるパディングを使用しないこと — スクリーンショットはtight, densityの高いテキストブロックを示しています
• ドロップシャドウや3D効果を使用しないこと — スクリーンショットはフラットな2Dサーフェスを示しています
• 避ける: 装飾的な要素
• 避ける: カラーアクセント
• 避ける: フレンドリーな挨拶
• 避ける: 複雑なグラデーション

10

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

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

11

System Prompt

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