Steep
温かみのある紙におけるセリフ体フォントの分析
Steepは分析結果を編集コンテンツとして提示します。Signifierセリフの見出しがほぼモノクロの白いキャンバスの上に浮かび、温かみのあるピーチ色のアクセント（#fbe1d1）が、それ以外は無彩色なシステムを強調しています。ページはまるで製品雑誌の見開きページのように、大きく筆記体の書体、十分なテキストスペース、24pxの丸みを帯びたエッジを持つ大きなカード、そして表面と面一になったピル型のコントロールで構成されています。コンポーネントは落ち着いていて、重さを感じさせません。影は控えめで、境界線は細く、色は機能的な強調に使用されています（ピーチ色のコールアウト、ピーチ色の背景に濃い茶色の文字）。製品サーフェス（地域テーブル、アクティベーション図、AIビルダー）は、ダッシュボードのシェル内にネストされるのではなく、ヘッダーの周りに浮かぶ要素として表示されます。
ページレイアウトは最大幅1200pxで中央揃えとなっており、メインセクションはほぼページ幅全体を占めますが、コンテナ内に収まっています。メインレイアウトは、中央に配置された大きなセリフ体フォントのヘッダー、サブヘッダー、および2つのピルボタンで構成され、周囲には4つのフローティング製品説明カード（左上は地域表、右は登録カード、左下はアクティベーション図、中央下はAIエディター）が配置され、白いキャンバス上に様々なオフセットで重なり合っています。各セクションはPaper WhiteとCard Mistの背景を交互に使用し、強いコントラストのない穏やかなリズムを生み出しています。機能セクションでは、テキストとUIの2列レイアウトを使用し、80pxの大きな垂直ガターが設けられています。ナビゲーションは、透明なトップバー（背景、境界線、影なし）で、左側にロゴ、中央にナビゲーションリンク、右側に2つのコールトゥアクション（テキストリンク＋塗りつぶされたピルボタン）が配置されています。レイアウト全体の密度はゆったりとしており、ページはセクション間で「呼吸」し、コンテンツが端に詰まることはありません。
ビジュアルデザインはライフスタイルではなく製品に焦点を当てています。浮遊するUI要素（5行のデータを含む地域別テーブル、8月から11月までのアクティベーションを示す折れ線グラフ、放射状のプログレスリング、AI入力フィールド）は、編集記事の見出しの周りに切り抜かれたスクリーンショットとして配置されています。写真、イラスト、抽象的なグラフィックは一切使用されていません。すべてのビジュアル製品要素は、細い枠線と柔らかな影が付いた白い浮遊カード上に配置されています。アバターの円には小さなカーソル方向指示器が付いており、リアルタイムのインタラクションを示す視覚的なモチーフとなっています。メイン構成は、ストックフォトを中央に配置した見出しではなく、テキストとUIのコラージュです。
パレット
中性
- Ink Black
#17191c— 本文、塗りつぶされたボタンの背景、ナビゲーションのロゴは、システム内で唯一暗い部分です。本文中のすべての行動喚起と見出しは、このほぼ黒色の背景に対して表示されます。 - Paper White
#ffffff— ページキャンバス、ボタンのテキスト、エンボス加工されたカード表面が主要な背景色調であり、約76の周波数ポイントを持つ。 - Mist Gray
#f2f2f3— カードの表面、追加の背景、入力フィールドの塗りつぶしなど、紙の下に埋め込まれたコンテンツ用の目に見えないレイヤー。 - Fog White
#fafafb— マウスオーバー時にセクションと表面が交互に切り替わる追加ページ背景 - 紙面より一段高い位置に表示されることで、微妙なストライプのバリエーションを生み出します。 - Slate Gray
#777b86— リンクの色、控えめな補助テキスト、フッターテキスト - メインテキストと含めることができないテキストの間に配置される、落ち着いた彩度の低いグレー。 - Ash Gray
#979799— 追加ラベル、カテゴリタグ（マーケティング、財務、営業） - リンクの色より一段階明るい色。
タイポグラフィ
15～90ピクセル・8段階
- Signifier — 交換： GT Sectra · 概要 400 · 見出しやタイトル用のセリフ体フォント。H1/H2 にのみ使用され、3 つのサイズがあります。フォントの太さはすべてのスケールで 400 (レギュラー) のままです。これは特徴的な選択です。セリフ体フォントは、太字フォントのように叫ぶのではなく、ささやくような印象を与えます。
- Sohne — 交換： Inter · 概要 400, 430, 450, 480, 500 · メインフォント、インターフェースフォント、ナビゲーションフォントは汎用性が高く、メタデータから小見出しまであらゆる用途に対応します。半段階的な太さ（430、450、480）により、太字にすることなく微妙な階層構造が生まれます。
音程と形式
| 目的 | 意味 |
|---|---|
| 密度 | 平均 |
| 基本的なステップ | 8px |
| ボタンの半径 | 9999px |
| カード半径 | 24px |
| 影 | いいえ - 影の代わりに境界線 |
| セクション間 | 80px |
| ページ幅 | 1200px |
AI がSteepスタイルであなたのウェブサイトを構築し、
- リンクから商品や投稿を追加してください - Instagram 、 TikTok 、 Facebook 。
- 古いサイトからコンテンツを移行するには、アドレスを指定するだけです。
- 最高のエンジンであるReact （ Next.js ）上で動作するモダンなデザイン。サーバーレンダリングとSEO最適化が標準搭載されています。
- 検索結果のSEO最適化とニューラルネットワークによるレコメンデーションを完全に自動化。
類似のスタイル
- Newformcap — 更衣室にある社説新聞
- Claude — 温かい羊皮紙に印刷された工芸品――骨紙にインク、粘土だけが唯一の色彩の息吹
- 11x– Digital workers — 映画のような編集上の荒廃地――風景のパノラマ写真が、高級雑誌の見開きページのような巨大なセリフ体の見出しを背景に配置されている。
- Revolut — 雲の写真をもとにしたモノクロの編集作品。白いインク、ピルボックスボタン、そしてモノクロの世界の中にぽつんと浮かぶ一本の青い線。
- Scheduling — クリーム色の紙に編集用インクで印刷
- Titan — 温かみのあるモノクロームアーカイブ
- Programa — 正午のスイスのデザインスタジオ。白いギャラリーの壁は、たった一つの黄色いテーブルランプによって照らされている。すべてがグレーの濃淡で統一されているが、ボタンやアイコン、あるいはアクセントとなるものが目に留まると、そのたった一つの黄色いアクセントが部屋全体を決定づける。
- Sana Agents — 白い背景にライムの輝きを放つ、編集記事
- Visual — 温かみのある編集版サミズダート。クリーム色の紙、セリフ体のポスター、モノクロの余白、黄色のマーカー1本。
- Midday — 羊皮紙に印刷された編集用パンフレット - 温かみのある石色の背景に72pxのセリフ体見出し、間隔を空けたサンセリフ体本文、ピル型のコントロール、影なし
- Chat for impact — 森のような緑色のクリニックに、パステルカラーの部屋が並んでいる。
- Handhold — 温かみのある羊皮紙のような質感と、かすかに聞こえるセリフ体――色彩ノイズのない手書きのレイアウトで、最高級の200ポイントのセリフ体フォントが、その声の全てを伝えている。