厳選・オープン・無料

Ka Ra Studio

木工デザイン・プラクティスのための、抑制されたタイポグラフィ重視のポートフォリオ。

01

デザイン DNA

オーダーメイドの木製品を展示するキュレーションされたギャラリー展。

02

カラー

暖かい白と豊かな木目調のブラウンインクを主体とした2トーンのパレット。

03

タイポグラフィ

transitional-serif

• display34px · 400
• body15px · 400

プライマリ・タイプフェース「A B C Laica」はすべてのテキスト要素に排他的に使用。 · すべてのテキストは均一のウェイト400を維持。 · テキストカラーは、白背景上の暖かい木目調のブラウンに厳密に限定。

04

余白

十分なパッディングとマージンが、落ち着いた、焦りのない閲覧体験を生み出す。

05

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

ボーダーはプライマリ・インクカラーを使用し、非アクティブな状態では微細なグレースケールと組み合わせることがある。

06

レイアウト

豊かなホワイトスペースと中央揃えのテキストを備えた、単一カラムの垂直スクロール・レイアウト。

07

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

インタラクティブ要素に対する、ホバー時の微細な透明度の変化。

インタラクティビティを示すための、テキストリンクの透明度の軽減。 · 標準的なブラウザ・ナビゲーション。

08

コンポーネント

• button 括弧で囲まれたテキストベースのリンク。カーソルの変化と透明度遷移で相互作用を実現。
• card 中央揃えのテキスト説明を下に持つ、大型のボーダーレス・フォトグラフィックカード。
• hero テキストを多用した導入ブロックと、その後に続くグリッドまたは単一の大きな画像。

09

文体と禁止事項

• トーン 洗練され、静かで、自信に満ちている。
• 見出し 宣言的で、しばしばオブジェクト名と素材を記述。
• CTA 「見る」や「情報」のようなシンプルなアクションを括弧で囲み、控えめに表現。

• ダーク背景を使用しない — スクリーンショットは清潔な白背景を示している。
• サンセリフ・タイポグラフィを使用しない — スクリーンショットは特徴的なトランジショナル・セリフ・フェースを示している。
• 明るいアクセントカラーを使用しない — スクリーンショットはモノクロのブラウンインク・パレットを使用している。
• 重いドロップシャドウを使用しない — スクリーンショットは完全にフラットな表面処理を示している。
• 複雑なマルチカラム・グリッドを使用しない — スクリーンショットはシンプルで中央揃えの垂直フローを示している。
• 太字のフォントウェイトを使用しない — スクリーンショットはすべてのテキストで均一のウェイト400を示している。
• 避ける: マーケティング用語
• 避ける: 目立つCTA
• 避ける: 過度な装飾

10

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

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

11

System Prompt

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