厳選・オープン・無料
Increase
テクノロジー企業向けエンタープライズグレードのバンキングAPI。
fintechapi
01
デザイン DNA
エンタープライズバンキングAPIインフラストラクチャ開発者
金融インフラ向けに精密に設計されたダッシュボード。
02
カラー
#31F2CCAccent
#1A2B3BInk
#687887Ink soft
#FFFFFFBG
#F5F6F7BG soft
#E4E5E9BG quiet
#314352Muted
rgba(26, 43, 59, 0.1)Line
信頼性を支えるディープネイビーを基調とした、清潔でプロフェッショナルなパレット。モダンなテクノロジー感を表現する鮮やかなティールとライムのグラデーションでバランスを保っています。
03
タイポグラフィ
grotesque-sans · monospace
- display
72px · 700 - h2
40px · 700 - body
16px · 400 - caption
14px · 400
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
明確なビジュアル階層を実現する、一貫した4pxグリッドシステム。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
1px solid rgba(26, 43, 59, 0.1)
rgba(12, 25, 39, 0.05) 0px 6px 8px 0px · rgba(12, 25, 39, 0.06) 0px 16px 20px 0px · rgba(12, 25, 39, 0.1) 0px 50px 60px 0px
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
12カラムグリッドを持つ最大幅のコンテナ。メインコンテンツを中央に配置します。
07
モーションとインタラクション
150msmicro
300mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
インタラクティブ要素のホバーステートに対する滑らかなトランジション · インタラクション時の繊細な色とシャドウの変化
繊細な色のトランジション、またはわずかなシャドウの浮き上がり。 · 主に色やスケールの変化による、即座のビジュアルレスポンス。
08
コンポーネント
- button ダークなピル型プライマリボタンに白テキスト。セカンダリボタンは白地にダークなボーダーとアイコンを配置。
- card 繊細なドロップシャドウと12pxのボーダー-radiusを持つ、清潔な白いカード。
- chip 小型の、角丸のピル型ラベル。
- input 繊細なボーダーと角丸を備えた、清潔なテキストフィールド。
- hero ダイナミックで重なり合う幾何学的グラデーションと組み合わせた、インパクトのある大きなタイポグラフィ。
09
文体と禁止事項
- トーン プロフェッショナルで権威があり、開発者に焦点を当てたトーン。
- 見出し エンタープライズグレードの信頼性を強調する、直接的で力強いメッセージ。
- CTA 明確な矢印を伴う、アクション指向の表現。
- セリフフォントを使用しない — スクリーンショットではヘッドラインと本文にグロテスクサンスを使用
- 複雑でオーガニックなイラストを使用しない — スクリーンショットでは大胆でフラットな幾何学的グラデーションを使用
- 明確な階層のない、広々としたレイアウトを使用しない — スクリーンショットでは構造化されたコンパクトなグリッドを使用
- 明るいネオン色をプライマリUI要素として使用しない — スクリーンショットではディープネイビーをベースにアクセントに鮮やかな色を使用
- すべての要素に重いドロップシャドウを使用しない — スクリーンショットではカードやボタンにのみ繊細なシャドウを使用
- 雑然としたナビゲーションバーを使用しない — スクリーンショットでは清潔でミニマルなトップナビゲーションを採用
- 避ける: 過度にカジュアルなスラング
- 避ける: 装飾的な形容詞
- 避ける: 曖昧なマーケティング用語
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
これはエンタープライズ開発者向けに設計されたプロフェッショナルなフィンテックSaaSプロダクトです。パレットは信頼性を支えるディープネイビー(#1A2B3B)を基調とし、モダンなエネルギーを表現する鮮やかなティール(#31F2CC)とライムグリーンのグラデーションで対比させています。タイポグラフィにはグロテスクサンスをヘッドラインと本文に、コードスニペットにはモノスペースを採用しています。レイアウトはグリッドベースで、ゆったりとしており、高い可読性を持ちます。重要な制約:セリフフォントを使用せず、雑然としたUIを避け、過度に遊び心のあるオーガニックなビジュアル要素は絶対に使用しません。権威を維持するため、プライマリボタンとテキストにはディープネイビーを使用してください。
en · zh-CN · zh-TW · ja · ko