厳選・オープン・無料

Gumroad

クリエイターが自身のオーディエンスに直接販売することを可能にするプラットフォーム。

01

デザイン DNA

独立したクリエイター向けの、歓迎のデジタルマーケットプレイス。

02

カラー

温かみのあるニュートラルベースに、遊び心のあるアクセントを加えたハイコントラスト。

03

タイポグラフィ

geometric-sans

• display48px · 500

04

余白

中央要素の周りにたっぷりとした余白。

05

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

インプットや一部のカードには、薄い1pxのsolidボーダー。

06

レイアウト

浮遊する3D要素を含む、中央配置のヒーローセクション。

07

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

ボタンやリンクの控えめなhover遷移。

背景色の変化またはopacityの変化。 · 控えめなscaleまたは色の変化。

08

コンポーネント

• button 白テキストのsolid黒、角丸。
• card 角丸、白背景、薄いボーダー。
• input 角丸、薄いボーダー、白背景。
• hero 大型ディスプレイフォントを使用した中央揃えテキストと、CTA。

09

文体と禁止事項

• トーン 励ますような、率直でフレンドリーなトーン。
• 見出し 太字で明確。「0から1ドルへ」といったモチーフを使用。
• CTA 「販売を始める」のような、行動を促す動詞。

• 純白の背景を使用しない — スクリーンショットでは、代わりに温かみのあるオフホワイト（#F4F4F0）が示されています。
• アクセントに青を使用しない — スクリーンショットでは、代わりにピンク/マゼンタの装飾要素が示されています。
• 装飾的なセリフフォントを使用しない — スクリーンショットでは、代わりに幾何学的サンセリフフォントが示されています。
• 重いドロップシャドウを使用しない — スクリーンショットでは、代わりに薄いボーダーを持つフラットデザインが示されています。
• 複雑なグラデーションを使用しない — スクリーンショットでは、代わりにsolidカラーとクリーンな遷移が示されています。
• 過密なレイアウトを使用しない — スクリーンショットでは、代わりにたっぷりとした余白と中央揃えのコンテンツが示されています。
• 避ける: 専門用語
• 避ける: 複雑さ
• 避ける: 形式張った表現

10

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

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

11

System Prompt

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