厳選・オープン・無料
Kippo
ゲーマー専用にデザインされた、ハイコントラストなネオンアクセントを特徴とする、ダークテーマの出会い系アプリランディングページ。
App UIMobile UIDark ModeBold TypographyConsumer
01
デザイン DNA
出会い系ゲーマーソーシャルアプリ
ネオンに照らされたアーケードと現代的なソーシャルハブの融合。
02
カラー
#EE1F66Accent
#FFFFFFInk
#000000BG
#29292ABG soft
#CFCFCFMuted
rgba(255, 255, 255, 0.15)Line
単一のネオンピンクアクセントとモノクロームのテキスト階層を持つ、ハイコントラストなダークモード。
03
タイポグラフィ
monospace · Source Code Pro
- display
42px · 700 - body
12px · 400
テキストはすべて大文字 · 本文や表示テキストにモノスペースを多用 · 見出しやナビゲーションに広い文字間隔
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
十分な余白を確保した、一定の4pxベースグリッド。
05
サーフェス (角丸 / 影 / 罫線)
sm · 10px
md · 15px
lg · 28px
pill · 999px
1px solid rgba(255, 255, 255, 0.15)
0 4px 24px rgba(0, 0, 0, 0.5)
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
テキストを左に、デバイスモックアップを右に配置した非対称2カラムのヒーローセクション。
07
モーションとインタラクション
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
ホバー時の透過度遷移(0.2秒) · インタラクティブ要素のスムーズなホバーステート
インタラクティブ要素の透過度変化。 · 即座のビジュアルレスポンス。
08
コンポーネント
- button 太字のモノスペーステキストを持つ、ソリッドなネオンピンクボタン。
- card 繊細な1pxボーダーを持つダークグレーパネル。
- chip 該当なし。
- input 該当なし。
- hero カラフルなシャドウアクセントが施されたデバイスモックアップと、大きな大文字テキスト。
09
文体と禁止事項
- トーン 自信に満ち、エネルギッシュで、ゲーマー中心。
- 見出し 太字、大文字、広い文字間隔のモノスペース。
- CTA 直接的、大文字のモノスペースコマンド。
- セリフフォントを使用しない — スクリーンショットはモノスペース/サンセリフのみを使用している。
- ホワイト背景を使用しない — スクリーンショットは主にブラック背景である。
- 低コントラストのカラーを使用しない — スクリーンショットは黒地にハイコントラストなホワイトとネオンピンクを使用している。
- 見出しに小文字を使用しない — スクリーンショットは広い文字間隔を持つすべて大文字のテキストを使用している。
- くすんだ、あるいは控えめなアクセントカラーを使用しない — スクリーンショットは鮮やかなネオンピンク(#EE1F66)を使用している。
- 細いボーダーを使用しない — スクリーンショットは1pxのボーダー、あるいはボーダーなしを使用している。
- 避ける: セリフフォント
- 避ける: パステルカラーパレット
- 避ける: フォーマルなビジネス言語
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
Kippoは、ゲーマー向けに特別にデザインされた、大胆でダークな美学を持つ出会い系アプリのランディングページです。デザインは、ソリッドなブラック背景(#000000)を鮮明なホワイトテキストと鮮やかなネオンピンクのアクセント(#EE1F66)で対比させています。タイポグラフィは、表示テキストと本文の両方でモノスペースフォント(Source Code Pro)が主に使用され、広い文字間隔と大文字変換が特徴です。重要な禁止事項には、セリフフォントの使用禁止、明るい背景の使用禁止、鮮やかなピンクアクセントの使用回避の禁止が含まれます。レイアウトは、デバイスモックアップとグラデーションアクセントを持つ非対称なヒーローセクションを特徴としています。
en · zh-CN · zh-TW · ja · ko