厳選・オープン・無料
Sunsama
モダンなプロフェッショナルのためのタスクマネージャーおよびデイリープランナー。
productcalendar
01
デザイン DNA
穏やか集中生産性計画デイリールーティン
穏やかに集中力を維持するのを助ける、静かなデイリープランナー。
02
カラー
#FF891CAccent
#202228Ink
#4C4F56Ink soft
#FFFFFFBG
#FAFAFABG soft
#F6F5F1BG quiet
#767F86Muted
rgba(32,34,40,0.1)Line
クリーンな白の背景に、温かみのある高彩度のオレンジアクセントとソフトなニュートラルグレー。
03
タイポグラフィ
geometric-sans · humanist-sans
- display
48px · 500 - h2
27px · 400 - body
16px · 400 - small
14px · 400
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
一貫した4pxの基本グリッドと、息が継ぎやすいレイアウトのための贅沢な垂直方向のスペーシング。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 10px
lg · 40px
pill · 48px
カードや入力フィールドの繊細な境界線として使用する、1px solid rgba(32,34,40,0.1)。
None: None · None: None
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
デスクトップでは左寄りのヒーローセクションを持つワイドコンテンツコンテナを、モバイルでは中央寄せのコンテンツスタックに流動的に展開。
07
モーションとインタラクション
200msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
ボタンやリンクの滑らかなhoverトランジション · インタラクティブな状態のための繊細なbackground-colorの変化
要素のベースカラーに応じた、繊細なbackground-colorの暗軒化または明軒化。 · タクタイルフィードバックのための、わずかなスケールダウン効果を伴う即時応答。
08
コンポーネント
- button 明るいオレンジの背景と白いテキストを持つ、ピル-shapedのプライマリボタン。
- card 軽い影がついた、白またはソフトグレーのカードで、generousな角丸(10pxから40px)。
- chip 繊細なボーダーやライトな背景を持つ、小さくて丸みのあるタグまたはラベル。
- input 可読性に焦点を当てた、繊細なボーダーを持つクリーンなインプット。
- hero ソフトな背景にboldなタイポグラフィと製品スクリーンショットを配置した、大きな分割セクション。
09
文体と禁止事項
- トーン 穏やかで、プロフェッショナルで、安心感を与える。
- 見出し 短く、断定的で、ベネフィット重視(例:「穏やかに始め、集中を維持」)。
- CTA 直接的でプレッシャーの低い表現(例:「無料で試す」「14日間無料トライアル」)。
- 攻撃的でコントラストの高いネオンカラーは使用しない — スクリーンショットはソフトな白、グレー、温かみのあるオレンジのパレットを示しています。
- 主要コンポーネントにシャープで四角いコーナーは使用しない — スクリーンショットは10pxから40pxの角丸を示しています。
- 密集した長文テキストブロックは使用しない — スクリーンショットはgenerousなスペーシングと簡潔なコピーを示しています。
- 装飾的で highly stylized なディスプレイフォントは使用しない — スクリーンショットはクリーンなジオメトリック/ヒューマニストsans-serifのシステムを示しています。
- ダークモードやハイコントラストのブラック背景は使用しない — スクリーンショットは主に白とライトグレーのサーフェスを示しています。
- 複雑で重いドロップシャドウは使用しない — スクリーンショットは奥行きを出すために非常に繊細で不透明度の低い影を示しています。
- 避ける: 過度に技術的な専門用語
- 避ける: 攻撃的なセールス言語
- 避ける: ダークまたは雑然とした視覚的メタファー
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 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
このサイトは、モダンなプロフェッショナルのための穏やかで集中力のあるデイリープランナー、Sunsamaのものです。明るくクリーンな白(#FFFFFF)とソフトグレー(#FAFAFA)のパレットを使用し、鮮やかなオレンジ(#FF891C)をアクセントとしています。タイポグラフィは、ジオメトリックおよびヒューマニストsans-serifカテゴリのクリーンなミックスです。重要な制約:generousなwhitespaceと4pxグリッドを優先し、フレンドリーな雰囲気のために10-48pxの角丸を使用し、穏やかで生産性を重視するポジショニングを損なうような、攻撃的、ダーク、または雑然とした視覚的メタファーは避けてください。
en · zh-CN · zh-TW · ja · ko