厳選・オープン・無料
Base
blockchain上に構築するための、ミニマルで信頼性の高いフィンテックプラットフォーム。
CryptoL2
01
デザイン DNA
blockchainグローバルファイナンスインフラストラクチャオープン組織的
blockchainのAWS——基盤的、エンタープライズグレード、かつ遍在する存在。
02
カラー
#0052FFAccent
#171717Ink
#000000Ink soft
#FFFFFFBG
#F8F8F8BG soft
#9A9A9AMuted
rgba(229,231,235,1)Line
ハイコントラストミニマリズム:鲜明な白地に深い黒のテキスト。プライマリアクションには高彩度の青を1色使用。
03
タイポグラフィ
geometric-sans · humanist-sans · geometric-mono
- display
54px · 700 - body
16px · 400 - small
14px · 400
UIとヒーローテキストにはbaseSansを使用 · モノスペース要素とデータにはGeist Monoを使用 · 大型ディスプレイ見出しではタイトな字間を維持
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
標準4pxグリッドを基調とし、大型セクションには十分な垂直paddingを確保。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 8px
lg · 12px
pill · 9999px
カードや入力フィールドには1px solid rgb(229, 231, 235)
rgba(0, 0, 0, 0.2) 0px 0px 18px 0px
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
明確な階層的間隔を持つ、中央揃えコンテンツコンテナ
07
モーションとインタラクション
150msmicro
200mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
インタラクティブ要素の控えめなフェードとカラー変化 · hover状態のトランスフォーム変化
0.15秒のcubic-bezierカーブを使用したカラー・ボーダーカラー変化 · 遅延状態変化なしの即時フィードバック
08
コンポーネント
- button 白文字を青背景にしたハイコントラストなピル形状プライマリボーダー付きセカンダリバリアント
- card 控えめなボーダーと明確な視覚的分離を持つ、クリーンな白カード
- chip ニュートラルな背景を持つシンプルなピル形状タグ
- input 明確なpaddingを持つ、クリーンなボーダーテキスト入力
- hero サブテキストとデュアルアクションボーダー付きの大型中央見出し
09
文体と禁止事項
- トーン 自信に満ち、組織的で、未来志向
- 見出し 太字で直接的、断定的
- CTA 行動を促し、明瞭
- ダークモードを使用しない——スクリーンショットは明るい白背景のヒーローセクションを示しています
- 装飾的なセリフ体を使用しない——スクリーンショットはクリーンで幾何学的なサンセリフによる見出しを示しています
- マルチカラーのグラデーションを使用しない——スクリーンショットはプライマリアクションに単一の高彩度の青を使用しています
- 重いドロップシャドウを使用しない——スクリーンショットは主要コンポーネントに最小限または可視シャドウなしを示しています
- カオスなレイアウトを使用しない——スクリーンショットは厳格に中央揃え、グリッドベースの階層的レイアウトを示しています
- 小さく詰まった間隔を使用しない——スクリーンショットはコアコンテンツ周辺に十分な余白を示しています
- 避ける: 遊び心のある表現
- 避ける: 過度な専門用語
- 避ける: 複雑な文章構造
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
信頼性の高い、組織的なフィンテックプラットフォームをデザインします。最大限の可読性のために、白を基調とした鮮明な背景に深い黒のテキストを使用します。プライマリブランドカラーは、ボタンやリンクなどのインタラクティブ要素にのみ使用する鮮やかな高彩度の青です。タイポグラフィはクリーンで幾何学的にし、見出しと本文にサンセリフを使用します。大型ディスプレイサイズでは現代的で技術的な印象を維持するため、タイトな字間を設定します。ダークモード、遊び心のある美学、マルチカラーのグラデーションは一切避けます。レイアウトは中央揃え、余裕があり、厳密にグリッドに合わせ、安定性と信頼性を伝えます。ボタンなどのコンポーネントはハイコントラストなピル形状にします。重要な禁止事項:ダーク背景を使用しないこと;装飾的なセリフフォントを使用しないこと;プライマリアクセントカラーを1色以上使用しないこと。
en · zh-CN · zh-TW · ja · ko