Slush
パステルカラーの紙に貼られた、膨らませるステッカーの世界
Slushはまるでステッカーアルバムのようです。パステルカラーの紙のキャンバスに、鮮やかな青の大きなリボンがふんだんに使われ、色とりどりのステッカーが紙吹雪のように散りばめられています。フォントは大きく、文字が凝縮されているため（横幅800×200～640ピクセル、行間0.75～0.80）、単語は文章というより彫刻作品のように見えます。6色の鮮やかなシグネチャーカラーがステッカーパレットとして機能し、それぞれの色が塗りつぶされたステッカー、カードの表面、または装飾レイヤーとして使用され、控えめなアクセントとして使われることはありません。コンポーネントは丸みを帯びており（カードでは20～40ピクセル、ナビゲーションではピル型）、手作り感を出すために黒で縁取られています。その結果、フィンテックのランディングページというよりは、明るい色の壁にピンで留められた物理的なコラージュのような仕上がりになっています。
レイアウトは、サイドバーや固定コンテナのない、全幅スクロールページを特徴としています。スクロールテキストとミニマルなトップナビゲーション（左にロゴ、中央にナビゲーションバー、右に塗りつぶされたコールトゥアクション）は上部に残ります。各セクションは、全幅のカラーストリップ（#dceeff → #ffffff → #cccccc）で、拡大されたサイドテキストが中央揃えまたは左揃えで配置され、3Dの青いリボンで囲まれています。コンテンツのレイアウトは、グリッドベースではなく、意図的にゆるやかでコラージュのようなデザインになっています。ステッカーがテキストに重なり、リボンがテキストの後ろで交差し、QRカードがセカンダリセクションの中央からずれた位置に配置されています。垂直方向のリズムはかなり広く（セクション間の間隔は48px）、水平方向の構成は意図的に非対称になっています。ページは上から下まで、それぞれが独立したポスターである3つの大きなカラーストライプとして読み取れます。
ビジュアル言語の中心は、3次元の青いリボンです。これは、各セクションの見出しテキストを包み込んだり覆い隠したりする、ざらざらとした質感の膨らんだチューブ状のエレクトリックブルーの図形で構成された、統一されたブランドモチーフです。装飾的な2次元のステッカー（ロケット、金貨、緑のチェックマーク、紫の財布）は、ボードにピンで留められた紙の切り抜きのように見出しの周りに浮かび、それぞれに黒い輪郭線（1ピクセル）が付いています。写真は一切使用されていません。従来のイラストグリッドも存在せず、すべてがコラージュされ、非対称に配置されています。3次元のリボンがメインの雰囲気を作り出し、ステッカーが遊び心のあるタッチを加え、残りは文字と色で構成されています。
パレット
ブランド
- Electric Blue
#4da2ff— ブランドの基調色である太いリボンの彫刻、画像の背景、カード上のぼかし模様などは、各画面の基盤となる視覚的な特徴となっている。
中性
- Carbon
#000000— メインテキスト、カードフレーム、行動喚起のための背景、そしてロゴは、パステル調の表面に手切りしたステッカーの輪郭のような効果を生み出している。 - Paper White
#ffffff— キャンバスページ、厚紙の表面、ボタンの輪郭線で塗りつぶし、暗い背景にテキスト。 - Sky Wash
#dceeff— メインセクションの背景、淡い青色のパステル調の背景。 - Concrete Gray
#cccccc— 二次セクションの背景、中立的な中間面 - Soft Mist
#e9e9e9— 微妙なボタンと表面の色調、無効状態 - Mint Pop
#55db9c— 背景、装飾的なストライプ、そしてコンテンツの背後にある柔らかなアクセントを強調するために、緑色で塗りつぶします。
タイポグラフィ
12～640ピクセル・7段階
- Lateral — 交換： Druk · 概要 800 · 見出し部分、つまり「SLUSH」のロゴや「ALL THINGS SUI」といったセクションバナーのみが、200～640ピクセルのフォントサイズで、行間を0.75～0.80に縮小して表示され、文字が立体的なブロック状に見えるようになっています。これは従来とは異なる表示方法で、800ポイントのフォントサイズで行間を0.85未満に設定したウェブサイトは他にありません。この効果により、テキストはまるで立体的なリボンで包まれた物体のように見えます。
- Aeonik Pro — 交換： Inter · 概要 500, 700 · 本文、ナビゲーション、ボタン、小見出しを含むユーザーインターフェース全体。本文とメタデータにはウェイト500（12～16px）、小見出しとナビゲーションラベルにはウェイト700（24～30px）、大きな二次見出しには700を64pxずつ増分します。文字間隔を狭く（-0.010em）すると本文（14～16px）が狭くなります。ナビゲーションラベル/ボタンをわずかに広げる（0.030～0.032em）ことで、コントロールに「余白」が生まれます。
音程と形式
| 目的 | 意味 |
|---|---|
| 密度 | 密集 |
| 基本的なステップ | 4-12px |
| ボタンの半径 | 1600px |
| カード半径 | 20px |
| 影 | いいえ - 影の代わりに境界線 |
| セクション間 | 48px |
| ページ幅 | 1440px |
AI がSlushスタイルであなたのウェブサイトを構築し、
- リンクから商品や投稿を追加してください - Instagram 、 TikTok 、 Facebook 。
- 古いサイトからコンテンツを移行するには、アドレスを指定するだけです。
- 最高のエンジンであるReact （ Next.js ）上で動作するモダンなデザイン。サーバーレンダリングとSEO最適化が標準搭載されています。
- 検索結果のSEO最適化とニューラルネットワークによるレコメンデーションを完全に自動化。
類似のスタイル
- Apple iPhone Duo — 白いギャラリーの中に折りたたみ式デバイスが置かれている。中央には製品のビジュアルレンダリングが配置され、文字と青色の操作ボタンは意図的に控えめな色調に抑えられている。
- AYOCIN — 健康を象徴する太陽のトーテム。温かみのある室内写真のようなスクリーンを創り出す。荘厳な書体、柔らかくぼかされた建築物の影、そして穏やかで柔らかな空間に置かれた、光り輝く一つのオブジェ。
- Apple AirPods 5 — Apple ― 白い背景に映し出される映画。編集のための広大な白い空間は、動く物体のシルエットと鮮やかな照明が視覚的なドラマを生み出す長編コマーシャルへと繋がる。
- Hopper — 夕暮れ時のサントリーニ島を窓から眺める。目的地を写した柔らかな写真が雰囲気のあるオーバーレイとして用いられ、その上にコンパクトな白いナビゲーションと予約コントロールが配置されている。
- Bose — 海岸沿いの撮影スタジオ。風になびく広告画像が画面いっぱいに広がり、その周囲には、まるで精密なディテールのように、鮮明な白黒のキャンペーン管理ツールが配置されている。
- Bauhaus Clock — バウハウスにインスパイアされた時計 ― ターコイズブルーの機械式発光。落ち着いた明るい表面を、暗く映画のような時計のイメージで縁取り、ターコイズブルーを希少な発光ディテールとして用いる。
- Cursor — くすぶる炭火に照らされた、居心地の良い羊皮紙工房
- MindMarket — クリーム色の紙に印刷された、居心地の良いおとぎ話の本。大きなInterの見出しと切り抜かれた紙のキャラクターが、太陽の光を浴びたような、ステッカーのように柔らかい表面に共存する、親しみやすい編集上のキャンバス。
- Shop — 白い大理石の上に浮かぶ交易の星座
- Airbnb — 静かな白いギャラリーの壁に、サンゴ色のしおりが1枚だけ飾られている。
- Superr — 午後の柔らかな光に照らされた、温かみのあるノート。クリーム色のページ、キャップのないオレンジ色のマーカー、そして剥がされるのを待つラミネート加工された名前シールの束。
- Apple (España) — 柔らかな自然光に照らされた美術館のギャラリーは、魅惑的で軽やかな白い空間で、それぞれの展示品は淡い色合いの壁にスポットライトで照らされている。