Telegram、 WhatsApp+380637610482
ヴァレリー・ダニュク
ヴァレリー・ダニュク開発者企業向けAIツールの開発。高品質で、お手頃価格。Telegramで連絡
Slash — このスタイルのサイトのプレビュー

Slash

金箔の帳簿が付いた真夜中の金庫

Slashは、真夜中のギャラリーのような雰囲気で動作します。ほぼ黒一色のキャンバスに白い文字、そして句読点として機能する温かみのある銅色のアクセントが一つだけ配されています。見出しは、コントラストの高いディドンセリフ体であるIvy Prestoで表示され、最大88pxという極端なサイズで使用されます。このセリフ体とサンセリフ体の書体の衝突こそが、このシステムの特徴であり、従来の銀行のような証券会社の重厚さではなく、金融的な重厚さを与えています。その他のユーザーインターフェースは意図的に控えめに設計されています。細い境界線、ピル型のコントロール、コンパクトな16pxの本文テキスト、そして文字にゆとりを持たせるためのわずかな上向きの傾斜が特徴です。モノクロのシステムに温かみを加えるために、金色のグラデーション(チャート線、マイクロアクセント)が一つだけ用いられ、デザイン重視のユーザー向けに作られたBloomberg端末の温かみのある輝きを彷彿とさせます。

コンテンツは幅1216pxで中央揃え、縦方向のガターは160pxです。ホーム画面は、分割構成のダークな全幅キャンバスです。左揃えのセリフ体ヘッダー(幅64~88px)の下にメールアドレス入力欄があり、右側には幅50%の大きな製品UIカード(ダッシュボードのスクリーンショット)があります。以降のセクションでは、中央揃えの単一列ヘッダー(セリフ体、幅44~64px)にInterフォントのサブ見出しがあり、その後に機能説明/お客様の声/ブログ用のカードが3列グリッドで配置されています。ナビゲーションは固定のトップバーで、左側にロゴ、中央にメニュー(会社、製品、ソリューション、クライアント、価格、FAQ)、右揃えのログイン(目立たない)、そして「はじめに」(白塗り)があります。フッターには、会社情報と法的通知へのリンクが密集した5列グリッドがあります。このページは、コンテンツが豊富なグリッドセクションと全画面表示の統計情報が交互に表示される構成になっており、背景色を交互に変化させるのではなく、列間の十分な余白によってリズムが作り出されている(ページ全体が単一の統一されたキャンバスとして表示される)。

写真は編集的で自然な雰囲気で、創業者やチームメンバーが実際の仕事環境(オフィス、リビングルーム、建設現場)にいる温かみのあるポートレートです。画像はカードフレームの端から端まで余白なしで埋め尽くされています。証言カードの下部には、テキストの読みやすさを高めるために暗いグラデーションが使用されています。美学は「LinkedInと編集雑誌の融合」であり、カジュアルで人間味があり、やや控えめで、ストックフォトで洗練されているわけではありません。記事のサムネイルは、写真とイラストによるコンセプト(迷路に立つ人、お金の入った袋が置かれた暖炉)を組み合わせています。製品のUIは、完全な不透明度でダークモードで表示され、微妙な暗い表面の上に浮かび上がっています。これは中心的な要素です。アイコンは、#2e3038または#777a88の1pxのストロークを持つモノクロで、ブランドカラーで塗りつぶされることはありません。

パレット

中性

  • Bone #e2e3e9 — 主要テキストには大きなフォントサイズを使用し、データラベルには詳細な情報を表示し、ほとんどのUI要素に標準的なテキストトーンを採用する。
  • Obsidian #08080a — ページ全体のキャンバス、フッターの背景、最も暗い部分は、かすかに青みがかったほぼ黒色です。
  • Onyx #040406 — カードの表面、つまり追加の背景部分は、視覚効果を高めるために、ページよりも一段深い構造になっている。
  • Carbon #121317 — 隆起したパネル、目立たないUIフィル - Surface Stackの進化における、初めて目に見えて軽量化されたステップ
  • Graphite #1c1d22 — 境界線、区切り線、アイコンコンテナ、コントロールスライダー――構造を定義する、極めて微妙な色の濃淡。
  • Slate #2e3038 — 追加の境界線、控えめなアイコンの線、コンテンツブロック間のさりげない区切り線。

タイポグラフィ

13~88ピクセル・9段階

  • Ivy Presto — 交換: Playfair Display · 概要 400, 500 · 見出しと小見出し専用のセリフ体フォント。28px以上のサイズで、見出しとセクションタイトルにのみ使用されます。コントラストの高いディドンストロークと細いセリフが、高級感のある編集印象を与えます。0.01emという小さなプラスの文字間隔は珍しく、印刷物や会計書類のような外観を醸し出します。このセリフ体フォントは、ブランドの核となる名刺代わりであり、幾何学的なサンセリフ体フォントを標準とする他のすべてのSaaSフィンテック企業とは一線を画しています。
  • Inter — 交換: Inter (self-hosted via Google Fonts) · 概要 300, 400, 500, 600, 700 · UI Sansは、本文、ナビゲーション、ボタン、ラベル、リンク、フォームフィールド、および小見出しに使用されます。本文では、目立たない補助テキストに300ポイントのフォントを使用し、中程度の強調テキストとボタンラベルには500ポイント、スモールキャップスで記述されたカテゴリラベルには600ポイントのフォントを使用します。文字間隔は2(-3)から始まり、サイズが小さくなるにつれて減少します。これは、Interフォントの光学スケーリングの特徴です。

音程と形式

目的意味
密度広々とした
基本的なステップ8px
ボタンの半径9999px
カード半径10px
いいえ - 影の代わりに境界線
セクション間160px
ページ幅1216px

AI がSlashスタイルであなたのウェブサイトを構築し、

  • リンクから商品や投稿を追加してください - Instagram 、 TikTok 、 Facebook 。
  • 古いサイトからコンテンツを移行するには、アドレスを指定するだけです。
  • 最高のエンジンであるReact ( Next.js )上で動作するモダンなデザイン。サーバーレンダリングとSEO最適化が標準搭載されています。
  • 検索結果のSEO最適化とニューラルネットワークによるレコメンデーションを完全に自動化。

類似のスタイル

  • Modal — 暗いサーバー室にある蛍光端末 ― 唯一の光源は鮮やかな緑色
  • AgentQL — 夜間、ターミナル上空に浮かぶオーロラ
  • GitHub — 生物発光制御ポイントを備えた宇宙空間の司令パネル――暗く雰囲気のある作業空間で、たった一つの緑色の光が進むべき方向を示す。
  • Doppler — 真夜中の金庫室は紫色の照明に照らされている。ほぼ黒色のキャンバスには、薄紫色の信号灯と緑色の確認灯が一つずつ灯り、あらゆる表面が掴めるほどに湾曲している。
  • Basedash — マットなフォントが使われた真夜中のデータ端末。暗い観測所では、計測値が紫と緑に光り、セリフ体の見出しが雑音の上に浮かび上がり、柔らかな黒い表面に囲まれた部屋の中で、白い錠剤型のボタンだけが明るく輝いている。
  • Superwhisper — オーロラが真夜中のガラスの上に溶け込む
  • Better Stack — ミッドナイトSREコンソール
  • Langbase — ミッドナイト・ノーザンライツ・コンソール
  • Astro — 星雲から放たれる紫色の光が一つだけ見える深宇宙ミッションコントロール
  • Wayfinder — 黒い映画画面に、かろうじて聞こえるタイトルがライブイラストの上に浮かんでいる。操作インターフェースは、コントロールパネルではなく、明るさ調整スライダーだ。
  • HashiCorp — 真夜中の紫色のネオンに照らされた制御室は、暗く技術的な空間であり、光り輝く六角形の立方体が唯一の色の基準となっている。
  • Umbrel — 夜間のサーバー室にある居心地の良い焚き火台――薄暗い部屋の中で、桃色の光が一つだけ、本当に大切なものを際立たせる。