厳選・オープン・無料
Warpcast
所有権と構築に焦点を当てた、穏やかなダークモードを先に考虑したインターフェースを持つ分散型ソーシャルネットワーク。
cryptosocial
01
デザイン DNA
分散型ソーシャルアイデンティティ構築コミュニティ
分散型ソーシャル宇宙への、暗く穏やかなポータル
02
カラー
#7959FFAccent
#FFFFFFInk
rgba(255,255,255,0.8)Ink soft
#121212BG
rgba(255,255,255,0.5)Muted
rgba(255,255,255,0.1)Line
深く暗い背景に高コントラストの白いテキスト、プライマリアクションのための鮮やかな紫のアクセント
03
タイポグラフィ
humanist-sans
- display
42px · 400 - body
16px · 400
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
一貫した4pxグリッドベースの间距
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 8px
lg · 12px
pill · 300px
1px solid rgba(255,255,255,0.1)
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
左に電話のモックアップ、右にコンテンツを配置したsplit-hero
07
モーションとインタラクション
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
すべてのインタラクティブ要素にトランジション
プライマリボタンの控えめな色の変化 · 即座に応答
08
コンポーネント
- button プライマリは高フィルのピル型、セカンダリは控えめ
- hero アプリのモックアップと太字のヘッドラインを持つsplitレイアウト
09
文体と禁止事項
- トーン 直接的で、力強く、穏やか
- 見出し 短く、パンチのある、ピリオド区切りのフレーズ
- CTA 明確で行動指向
- 明るい背景を使用しない — スクリーンショットは深く暗いモードのインターフェースを示しています
- プライマリボタンに鋭い角を使用しない — スクリーンショットはピル型ボタンを示しています
- 低コントラストのテキストを使用しない — スクリーンショットは暗い背景の高コントラストな白を示しています
- UI要素に複雑なグラデーションを使用しない — スクリーンショットはフラットまたは非常に控えめなグラデーションを示しています
- 雑然としたレイアウトを使用しない — スクリーンショットは清潔で広々としたsplit-heroデザインを示しています
- プライマリアクセントに赤やオレンジを使用しない — スクリーンショットは単一の支配的なアクセントとして紫を示しています
- 避ける: 感嘆符
- 避ける: 攻撃的な言葉
- 避ける: 専門用語
10
パック内の実スクリーンショット
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
Farcaster (Warpcast) は、構築とコミュニティのための穏やかなダークモードを先に考虑したプラットフォームとして位置付けられた分散型ソーシャルネットワークです。主要カラーは、深 charcoal背景 (#121212)、白のプライマリテキスト (#FFFFFF)、サインアップなどのプライマリアクションのための鮮やかな紫のアクセント (#7959FF) です。タイポグラフィは、モダンで可読性の高い印象のために、クリーンなhumanist-sans-serifフォント（Inter/SeasonMix）を使用します。重要な制約には、以下の点が含まれます：コアインターフェースはダークであるため、明るいまたは白い背景を決して使用しない；プライマリボタンには明確にピル型であるため、鋭い角を避けない；高アクセシビリティのダークテーマに反するため、低コントラストのテキストを決して使用しない。レイアウトは広々としており、oftenアプリのモックアップを使用したsplit heroを使用します。声は直接的で力強いです。
en · zh-CN · zh-TW · ja · ko