厳選・オープン・無料
Whimsical
技術チームおよびエージェント向けに専用構築されたホワイトボード
designtool
01
デザイン DNA
ホワイトボードコラボレーション技術的アイデア計画
エンジニア向けのデジタルキャンバス会議室
02
カラー
#9E39E5Accent
#220A33Ink
#5C275EInk soft
#FFFFFFBG
#F5F4F5BG soft
#6A5C70Muted
rgba(224,219,227,1)Line
クリーンなサーフェスにハイコントラストのインクを使用し、鮮やかな紫色のアクセントを加える
03
タイポグラフィ
humanist-sans · monospace
- display
96px · 700 - h2
32px · 700 - body
16px · 400
大きなディスプレイテキストにはタイトなネガティブトラッキングを使用 · インタラクティブな要素には中程度のウェイトを使用 · 厳格なタイポグラフィ階層を維持
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
8pxの垂直リズム
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
1px solid rgba(224,219,227,1)
0px 16px 32px -4px rgba(37,8,53,0.06) · 0px 12px 16px -4px rgba(37,8,53,0.2)
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
中央揃えのコンテンツを備えた12カラムのフリードグリッド
07
モーションとインタラクション
220msmicro
400mssmall
800msmedium
cubic-bezier(0.3, 0.1, 0, 1)easing
インタラクティブな要素の滑らかなhoverトランジション · カードのhover時の繊細な浮き上がり
繊細な背景色の変更またはtransform · 即座に視覚的なフィードバック
08
コンポーネント
- button 白いテキストを持つ濃い色のソリッド背景、またはアウトラインスタイル
- card 繊細な影と角丸を持つクリーンなコンテナ
- chip ラベル用の小さな角丸タグ
- input 明確なフォーカス状態を持つクリーンなボーダーフィールド
- hero 中央揃えの太字タイポグラフィを持つ大きなグラデーション背景
09
文体と禁止事項
- トーン プロフェッショナルで、明確かつ前向き
- 見出し 価値に関する大胆で簡潔なステートメント
- CTA 「無料で始める」のような直接的なアクション動詞
- ダークモードのインターフェースを使用しない — スクリーンショットは主に白/薄いグレーの背景を示しています
- 重いドロップシャドウを使用しない — スクリーンショットは柔らかく拡散したエレベーションシャドウを示しています
- 遊び心のある角丸のディスプレイフォントを使用しない — スクリーンショットはクリーンで幾何学的なヒューマンistサンセリフタイポグラフィを示しています
- ネオンや高彩度の色を使用しない — スクリーンショットは深い紫色のアクセントを含む抑制されたパレットを示しています
- 余分なボーダーでレイアウトを散らかさない — スクリーンショットは最小限のボーダー使用を示しています
- 長い段落に中央揃えを使用しない — スクリーンショットは機能グリッドで左揃えの本文コピーを示しています
- 避ける: 過度にカジュアルなスラング
- 避ける: 文脈のない密度の高い技術用語
- 避ける: 攻撃的なセールス言語
10
パック内の実スクリーンショット
桌面首屏（hero）
桌面滚动分段（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
Whimsicalは、技術チーム向けに専用構築されたホワイトボードとして位置づけられたプロフェッショナルな生産性ツールです。デザインは、クリーンな白と柔らかいグレーのサーフェスに対して、豊かで深い紫色を主なアクセントとするハイコントラストパレットに依存しています。タイポグラフィは、大きくインパクトのあるヘッドライン用のディスプレイフォントと、本文テキスト用の非常に読みやすいサンセリフを組み合わせています。重要な制約として、ダークモードや過度に遊び心のある美学の回避があります。インターフェースは構造化され、効率的です。十分なホワイトスペースを確保し、すべてのインタラクティブな要素に滑らかで意図的なトランジションがあることを確認してください。レイアウトは明瞭さと集中したコラボレーションを優先し、視覚的なノイズや重い装飾を避けるべきです。
en · zh-CN · zh-TW · ja · ko