厳選・オープン・無料

Limonoslo No

大胆なタイポグラフィ、暖色、没入型フードフォトグラフィを融合したモダンレストランのウェブサイト。

01

デザイン DNA

フレッシュな食材と大胆でクリーンなタイポグラフィを融合した、活気のあるモダンレストラン。

02

カラー

クリーム色の背景、ダークな自然のインク、鮮やかな黄色のアクセントを組み合わせた、暖かく歓迎するパレット。

03

タイポグラフィ

sans-serif

• display56px · 700
• heading36px · 700
• body16px · 400
• caption15px · 400

04

余白

4の倍数による一定の垂直リズムを確立し、バランスの取れた余白を確保。

05

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

強調用のダークグリーン（#103B15）の実線ボーダー、区切り用の薄いライトグレー（#D6D6D6）。

rgba(0,0,0,0.3) 0px 32px 68px 0px

06

レイアウト

明確な構造的区画と十分な余白を持つ標準グリッドレイアウト。

07

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

背景色と透明度の微細なトランジション。 · 動的レイアウト調整のための幅と高さのアニメーション。

インタラクティブ要素のカラーシフトと微細なトランジション。 · アクティブステートでのトランジションによる即座の視覚的フィードバック。

08

コンポーネント

• button ダークの頭文字大文字テキストを載せたソリッドイエロー（#F7EA48）ボタン、または白の頭文字大文字テキストを載せたダークソリッドボタン。
• card オーバーラップするテキストと微細なドロップシャドウを持つ写真レイアウト。
• chip 最小限の使用。主に構造的なナビゲーション要素。
• input 明確な視覚的フィードバックとダークボーダーを持つ標準フォームフィールド。
• hero 高品質なフードフォトグラフィを特徴とするフルワイドの没入型ヒーローセクション。

09

文体と禁止事項

• トーン 歓迎的、モダン、そして情熱的。
• 見出し 背景に対して高いコントラストを持つ、太字の頭文字大文字タイポグラフィ。
• CTA 強力なカラーアクセントを持つ、直接的で頭文字大文字のコマンド。

• クールでモノクロのパレットは使用しない — スクリーンショットは温かく歓迎的なトーンを示している。
• すべてのUI要素に重いドロップシャドウを適用しない — スクリーンショットは選択的な使用を示している。
• 繊細で低コントラストのタイポグラフィを使用しない — スクリーンショットは太字で非常に読みやすい字体を特徴としている。
• 明確なコンテンツ配信よりも複雑なアニメーションを優先しない — スクリーンショットは最小限のモーションを示している。
• 明確なラベルのない抽象的なアイコンを使用しない — スクリーンショットはテキストベースのナビゲーションに依存している。
• フルブリード写真を避けてはならない — スクリーンショットは没入型フードイメージを前面に使用している。
• 避ける: 厳しすぎる言葉遣い
• 避ける: 控えめなテキストのウェイト
• 避ける: くすんだカラーパレット

10

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

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

11

System Prompt

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