Monad
温熱羊皮紙に関する編集技術誌
Monadは、温かみのある羊皮紙のようなキャンバス（#f6f3f1）上にインターフェース全体を表示し、典型的な純白のSaaSテンプレートとは一線を画しています。見出しは編集的な重みがあり、Untitled Serifという400ウェイトのフォント（太字は使用しない）で設定されています。一方、本文、ナビゲーション、UI要素はすべてABC Diatype Monoで設定されており、まるで文芸誌向けに組版された技術マニュアルのような質感をサイトにもたらしています。鮮やかな青（Lake）が主要なアクションに唯一のアクセントカラーとして使用され、その他はすべて温かみのあるグレーのパレットで統一されているため、ペリウィンクル色のカード表面（#cfdaf5）と柔らかなパステル調のグラデーション（コーラル、スカイブルー、ミント、ゴールド）は、ノイズではなく意図的な句読点のように感じられます。コンポーネントは影ではなく、控えめな境界線とピル型の容器に依存しており、カードのようなインデントとセクション間の十分な垂直方向のスペースのおかげで、リズムは穏やかでゆったりとしています。
ビジュアル言語は、開発されたデータパイプライン図に基づいています。細い曲線で縁取られたピル型のノードがあり、各ノード内にはデータソース（あらゆるソース、クラウドログ、脆弱性）と宛先（SIEM、クラウドストレージ、データレイク）を表す小さなアイコンがあります。図の中央には、データ正規化を強調するために、柔らかな緑色の放射状の光が使用されています。メインコンテンツと機能コンテンツの背後には、強いぼかしフィルターを使用したグラデーションの雰囲気のある色調（コーラル→スカイブルー、スカイブルー→ミント）によって、柔らかな色のハローが生まれます。パートナーのロゴは1列に表示され、社会的影響を強調しています。「進行中のデータ変換」カードには、重なり合う半透明の幾何学的形状の大きなグラデーションのイラストが使用されています。写真は使用されていません。ブランドは、タイポグラフィ、図、配色のみで情報を伝達しています。
パレット
ブランド
- Parchment
#f6f3f1— ページキャンバスと表面の大部分を占めるこの温かみのあるクリーム色の色合いは、ブランドの象徴的な色であり、すべて白で統一されたSaaSテンプレートとは一線を画している。 - Lake Blue
#2b59d1— 紫色は、背景の強調、装飾的なストライプ、コンテンツのさりげないアクセントとして使用されます。行動喚起のメインカラーとして使用すべきではありません。
中性
- Off-Black
#242424— 明るい表面上の主要ボタンには、コントラストの高いニュートラルな塗りつぶしを使用します。 - Periwinkle Mist
#cfdaf5— 無効化されたコントロール、目立たないパネル、およびプレースホルダーブロックには、控えめなインターフェースが採用されています。 - Sky Blue
#a0b5eb— 装飾的なグラデーションストップ - 配管図の大気の塗りつぶしや流れ線に表示されますが、UIの塗りつぶしとして使用されることはありません。 - Mint
#a7fccd— メインカラーパレットとのコントラストが必要な場合に、小さな装飾アクセントとして使用できる補助的なカラーパレット。 - Coral
#ff9473— メインカラーパレットとのコントラストが必要な場合に、小さな装飾アクセントとして使用できる補助的なカラーパレット。 - Gold
#ecda98— 装飾的なグラデーションドットは、グラデーションの遷移における温かみのあるアクセントであり、機能的なユーザーインターフェースでは決して使用されません。
タイポグラフィ
12～80ピクセル・10段階
- ABC Diatype Mono — 交換： JetBrains Mono · 概要 400, 500 · メインテキスト、ナビゲーション、ボタン、アイコン、タグ、およびすべてのUIテキスト。すべての機能要素に等幅フォントを使用することで、インターフェースは技術マニュアルのような印象を与えます。16～20ピクセルのメインテキストは、マーケティング情報ではなくデータとして認識されます。ナビゲーションラベルとアイコンには、より正確な文字間隔の18ピクセルフォントを使用し、より小さなフォントとメタテキストには、すべて大文字の12ピクセルフォントを使用します。500ピクセルのフォントサイズは、目立つUI要素のために確保されています。
- Untitled Serif — 交換： Times New Roman · 概要 400 · 見出しと小見出しのみに使用。サイズは80px（本文）、48px（セクション）、40pxと32px（サブセクション）、24px（説明カードの見出し）です。フォントの太さは全サイズ共通で400に固定。セリフ体の自然なコントラストと-0.02emの文字間隔が、太字ではなく主役となる要素を際立たせます。これが編集スタイルです。見出しは、太字で主張するのではなく、洗練されたタイポグラフィでささやくように表現されます。
- Untitled Sans — 交換： Inter · 概要 400 · Untitled Sansフォント - 抽出されたデータには含まれているが、AIによって説明されていない。
音程と形式
| 目的 | 意味 |
|---|---|
| 密度 | 平均 |
| 基本的なステップ | 16px |
| ボタンの半径 | 100px |
| カード半径 | 40px |
| 影 | いいえ - 影の代わりに境界線 |
| セクション間 | 64px |
| ページ幅 | 1432px |
AI がMonadスタイルであなたのウェブサイトを構築し、
- リンクから商品や投稿を追加してください - Instagram 、 TikTok 、 Facebook 。
- 古いサイトからコンテンツを移行するには、アドレスを指定するだけです。
- 最高のエンジンであるReact （ Next.js ）上で動作するモダンなデザイン。サーバーレンダリングとSEO最適化が標準搭載されています。
- 検索結果のSEO最適化とニューラルネットワークによるレコメンデーションを完全に自動化。
類似のスタイル
- ElevenLabs — 温かみのあるクリーム色を基調としたフォトエッセイに、さりげない見出しを添えた一冊。バウハウス風のノートは、卵の殻のような色の紙に黒インク、そして製品紹介のために紫とオレンジのアクセントを一つだけ配している。
- Awesomic — オレンジ色の句読点が紙吹雪を思わせる、編集用の亜鉛メッシュ。
- Dub — リンクのマットな和紙製コントロールパネル
- Seline Analytics — 温かい紙の上に静かに置かれた分析表
- Notion — 真昼の太陽の下、温かい紙のノート
- Anthropic — 温かみのある羊皮紙に印刷された科学分野の専門誌――落ち着いた象牙色の表面、セリフ体の編集見出し、そして行動が必要な時だけ現れる、たった一つの粘土色のアクセント。
- Calendly — 冷たい大理石に濃い青色のインク
- Augen Pro — Appleの白いプレゼンテーションでは、モノクロームの空間に、臨床的で軽やかなエレクトリックブルーが唯一のアクセントとして用いられている。
- Antimetal — クリーム色の紙に書かれた編集記事――科学雑誌の静かな朝。そこでは、抑制された表現が自信を伝え、セリフ体が重要な役割を担っている。
- Perk — 温めたパーチメント紙に電気石灰を塗る
- Ditto — 陽光が差し込む工房で、野の花のサンプルが作られている。温かみのあるクリーム色の表面、鮮やかな黄色のベースカラー、深い紺色のインク、作品の背後で咲き誇る有機的な色彩。
- Officevibe — 温かみのあるクリーム色の紙に印刷された編集雑誌。人事管理に関する思慮深いエッセイが、まるで商品のように提示される様子を想像してみてください。モダンな青いインターフェースを通して、筆記体のセリフ体フォントがささやくように流れるのです。