厳選・オープン・無料

Pleo

集中型ビジネス支出および経費管理プラットフォーム

fintechsaas
Pleo のスクリーンショット
↓ デザインシステムをダウンロード (6 MB)OpenDesign で開く

オリジナル: https://www.pleo.io

📦 パックの中身を見る →

01

デザイン DNA

金融効率ビジネス支出自動化管理

現代の金融オペレーティングシステム

02

カラー

#FFFFFFAccent
#000000Ink
#333333Ink soft
#F5F5F5BG soft
#888888Muted
rgba(0, 0, 0, 0.1)Line

明瞭さと信頼のために高コントラストのモノクロパレット

03

タイポグラフィ

neo-grotesque-sans · monospace

04

余白

4px
8px
16px
24px
32px
48px
64px
96px

80pxのセクションパディングを備えた十分な垂直リズム

05

サーフェス (角丸 / 影 / 罫線)

sm · 4px
md · 4px
lg · 8px
pill · 159984px

インタラクティブ要素に1px solid rgba(0, 0, 0, 0.1)

06

レイアウト

1280container
12columns
24pxgutter
768 / 1024breakpoints

セントリングされたシングルコラムのヒーローと、交互配置のコンテンツブロック

07

モーションとインタラクション

130msmicro
230mssmall
400msmedium
cubic-bezier(0.4, 0, 1, 1)easing

hover時の滑らかな色および背景トランジション

控えめな色のトランジションまたは背景のシフト · 最小限の遅延での即時応答

08

コンポーネント

09

文体と禁止事項

10

パック内の実スクリーンショット

実ページから取得 · 実 computed styles

11

System Prompt

これはビジネス支出管理に焦点を当てたプレミアムフィンテックSaaSプラットフォーム。デザインは、信頼と効率を伝えるために、厳密なモノクロパレット(黒、白、ライトグレー)を用いた洗練されたミニマルな美学を採用。タイポグラフィはクリーンなネオグロテスクサンセリフで、大型の高コントラストヒーローセクション。主要なHEXカラーは#000000、#FFFFFF、#F5F5F5。重要なデザイン制約:装飾的なグラデーションや重いドロップシャドウの不使用、一貫した400ウェイトフォントの使用、標準的な角丸長方形の代わりにピル型ボタンの実装。複雑なマルチカラムヒーローレイアウトや鮮やかなアクセントカラーは避ける。

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック(エージェント用) ↗

en · zh-CN · zh-TW · ja · ko