厳選・オープン・無料

Stykka

カスタムキッチンやインテリアをデザインするためのプレミアム・プラットフォーム。大判のフォトグラフィック・ヒーローセクションと、洗練されたセリフ字体のタイポグラフィが特徴。

01

デザイン DNA

高端建築雑誌

02

カラー

ミニマルなパレット。高品質な写真にカラーを委ね、UI要素は厳格にモノクロームを採用。

03

タイポグラフィ

geometric-sans · humanist-sans · monospace

• display46px · 500
• body16px · 400

04

余白

画像の周囲にpaddingとgapを一貫して適用。

05

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

一部のインタラクティブ要素に、最小限の1px solid bordersを適用。

06

レイアウト

端から端まで延びる写真と、余裕のあるホワイトスペース・マージン。

07

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

スクロール時のフェードイン

リンクやボタンに微細なopacity変化。 · 即座の状態変化またはナビゲーション。

08

コンポーネント

• button 透明な背景に微細なボーダー。テキストのみのラベル。
• card ソリッドカラー背景のテキストを含む、大判のフォトグラフィック・カード。
• chip 小さなプラス記号やドットアイコンを伴うテキストラベル。
• input 下部のみにボーダーを持つテキスト入力フィールド。
• hero フルスクリーンのフォトグラフィック背景に、左寄せの大型タイポグラフィ。

09

文体と禁止事項

• トーン 専門的で、憧れを誘い、落ち着いたトーン。
• 見出し 直接的で描写的な、大型の幾何学的sans-serif。
• CTA 「Start building」のような、シンプルで行動を促すテキスト。

• 彩度の高いアクセントカラーを使用しない — スクリーンショットはモノクロームUIで、写真に委ねている。
• UI要素にドロップシャドウを使用しない — スクリーンショットは完全にフラットなデザイン。
• 本文テキストを中央揃えにしない — スクリーンショットは厳格な左揃え。
• 見出しに装飾的なスクリプト字体を使用しない — スクリーンショットは洗練された幾何学的sans-serif。
• 小さく密集したテキストブロックを使用しない — スクリーンショットは豊富なホワイトスペースと大型タイポグラフィ。
• 複雑なアイコングラフィを使用しない — スクリーンショットはシンプルで、テキストベースのナビゲーション。
• 避ける: 派手なアニメーション
• 避ける: 雑然としたレイアウト
• 避ける: 彩度の高いUIカラー

10

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

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

11

System Prompt

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