厳選・オープン・無料

Artek

フォトグラフィックなストーリーテリングと抑制されたクラシックなタイポグラフィを重視した洗練された家具ブランドのウェブサイト。

01

デザイン DNA

クリーンでハイエンドな家具カタログ

02

カラー

高品質な写真に大きく依存し、温かみと深みを提供するモノクローマティックなUIパレット。

03

タイポグラフィ

geometric-sans

• display48px · 400
• heading26px · 400
• body18px · 400
• small14px · 400

04

余白

45pxなどのパディングブロックで定義されることが多く、広めの余白。

05

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

控えめで、一般的にアウトラインやアンダーライン用に1px solid black。

06

レイアウト

テキスト用の構造化されたグリッドレイアウトが挟まれた、 larga なフル幅の写真セクション。

07

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

UI要素の滑らかなフェードインと微妙なトランジション。

微妙な色の変化や不透明度のシフト。 · 即時フィードバック。

08

コンポーネント

• button ミニマリストなアウトラインスタイルで、しばしばボーダーやシンプルな塗りつぶし付きのテキストのみ。
• card クリーンなテキストオーバーレイを備えた、画像主導。
• chip N/A
• input クリーンで、アンダーラインまたはボーダー付きのミニマリスト入力。
• hero 顕著で、中央揃えまたは左揃えのタイポグラフィを備えたフルブリード写真。

09

文体と禁止事項

• トーン 静かで、権威があり、エレガント。
• 見出し 短く、直接的で、タイポグラフィ的に際立っている。
• CTA 控えめで、しばしばアンダーライン付きのテキストやシンプルなボタン。

• 高彩度な色を使わない — スクリーンショットは厳格なモノクローマティックパレットを示しています。
• 重いドロップシャドウを使わない — スクリーンショットはフラットでクリーンな表面を示しています。
• 装飾的なセリフフォントを使わない — スクリーンショットは幾何学的なサンセリフタイポグラフィを示しています。
• 小さな密集したテキストブロックでレイアウトを雑然とさせない — スクリーンショットは広めのスペーシングを示しています。
• 派手でカラフルなボタンを使わない — スクリーンショットはミニマリストなアウトラインボタンを示しています。
• ダークモードを使わない — スクリーンショットは主にライトな背景を示しています。
• 避ける: 過度な装飾
• 避ける: 明るい色
• 避ける: 遊び心のある言葉遣い

10

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

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

11

System Prompt

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