厳選・オープン・無料
Capacities
考え、学び、創り出すすべてのための拠り所。
productivitynotes
01
デザイン DNA
ナレッジ管理オブジェクトベース接続されたノートあなたの心のスタジオ
アイデアを有形のオブジェクトとして扱う、ミニマルなデザインスタジオ。
02
カラー
#F59E0BAccent
#1C1917Ink
#57534EInk soft
#FBFBFABG
#FFF9EBBG soft
#F5F4F2BG quiet
#A8A29EMuted
rgba(0,0,0,0.06)Line
ブラックに近い色を基盤とした、温かみのある自然なニュートラル。単一のウォームゴールドアクセントを配します。
03
タイポグラフィ
geometric-sans · humanist-sans · monospace
- display
64px · 700 - h2
40px · 700 - h3
24px · 600 - body
16px · 400 - small
14px · 400
ディスプレイ见出しにはタイトなネガティブトラッキングを使用 · 本文は可読性を考慮し、快適な1.6の行間を維持 · モノフォントはコードブロックや技術的なスニペットにのみ使用
04
余白
4px
8px
12px
16px
20px
24px
32px
48px
64px
96px
128px
一定の4pxグリッドと、呼吸を活かすための余裕のあるセクションパディング（128px）を採用。
05
サーフェス (角丸 / 影 / 罫線)
sm · 6px
md · 8px
lg · 12px
pill · 999px
非常に控えめな1pxの実線ボーダー。暖かいライトグレーを使用。
0 1px 2px rgba(0,0,0,0.04) · 0 4px 12px rgba(0,0,0,0.08) · 0 20px 40px -4px rgba(0,0,0,0.12)
06
レイアウト
1200container
12columns
24pxgutter
768 / 1024breakpoints
センタリングされたヒーローセクションから、マルチカラムの機能グリッドへと展開するシングルカラムレイアウト。
07
モーションとインタラクション
150msmicro
200mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
インタラクティブ要素の微妙なhoverトランジション · モーダルやオーバーレイ表示時のフェードイン/フェードアウト
微妙な背景色の変化、またはopacityの変化。 · 色の暗転や微細なスケール縮小による即時的な視覚フィードバック。
08
コンポーネント
- button 白文字のハイコントラストなブラックプライマリ。テキストとアイコンはブラックのセカンダリは透明。
- card フローティングUIプレビューのための、非常に柔らかいドロップシャドウを持つ、角丸の白色長方形。
- chip 明るいパステル背景（ピーチ、ブルー、グリーン、パープル）と抑制されたテキストを持つ、角丸のタグ。
- input 角丸と控えめなボーダーを持つ、クリーンな単一ライン入力フィールド。
- hero フローティングするイラスト的なUIカードと、ウォームなラジアルグラデーションオーバーレイを伴う、大きなセンタリングタイポグラフィ。
09
文体と禁止事項
- トーン 落ち着いた、知的で自信のあるトーン。
- 見出し スキャンしやすい、直接的で便益を示すステートメント。
- CTA 「無料で始める」や「製品を見る」など、シンプルな動詞を用いた、行動を促す明確な表現。
- 純粋な寒色のホワイトを使用しない — スクリーンショットでは温かみのあるオフホワイト背景（#FBFBFA）が使用されている。
- 角を鋭くしない — スクリーンショットのカードやボタンには明確な角丸（8px-12px）が適用されている。
- 明るくネオンのようなアクセントを使用しない — スクリーンショットでは温かみのあるマットなゴールド（#F59E0B）がプライマリアクセントとして使用されている。
- 密度が高く、窮屈なレイアウトを作らない — スクリーンショットでは余裕のあるホワイトスペースとパディング（128px）が活用されている。
- 装飾的なセリフ体を見出しに使用しない — スクリーンショットではクリーンで幾何学的なサンセリフのディスプレイフォントが使用されている。
- 重いドロップシャドウを使用しない — スクリーンショットでは奥行きを出すために非常に柔らかく拡散されたシャドウが使用されている。
- 避ける: 過度に技術的な専門用語
- 避ける: 攻撃的なセールスコピー
- 避ける: 過剰な句読点
- 避ける: 曖昧、またはバズワード多用の記述
10
パック内の実スクリーンショット
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（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
Capacitiesは、「あなたの心のスタジオ」としてデザインされた、クリーンで洗練された生産性ツールです。温かみのあるオフホワイト背景（#FBFBFA）に、ブラックに近いインク（#1C1917）と、要点を強調する単一のゴールドアクセント（#F59E0B）を組み合わせています。タイポグラフィには、ディスプレイ用の幾何学的サンセリフと、本文用のヒューマニストサンセリフを採用し、落ち着いた知的なトーンを生み出しています。レイアウトは1280pxコンテナ、128pxのセクションパディング、豊富なホワイトスペースを活用した、余裕のあるもの。カードは柔らかく、微妙なシャドウで浮き上がり効果。重要な禁止事項：寒く臨床的なホワイトは絶対に使用しない；カードには決して角を丸くしない；攻撃的、またはネオンのような色は使用しない；密度が高く窮屈なレイアウトは回避する；装飾的なセリフ体を見出しに使用しない；重く攻撃的なドロップシャドウは絶対に使用しない。
en · zh-CN · zh-TW · ja · ko