厳選・オープン・無料

Forner Studio

落ち着いたミニマルな美学と強いタイポグラフィを備えた、洗練されたエディトリアルスタイルのスタジオポートフォリオ。

01

デザイン DNA

クリーンで洗練されたプロダクトプレゼンテーションに焦点を当てた、上質なデザインスタジオのポートフォリオ。

02

カラー

土を思わせる、彩度の低いウォームニュートラルが落ち着いた上質な背景をつくり、写真を際立たせます。

03

タイポグラフィ

geometric-sans · humanist-sans

• display45px · 400
• heading29px · 400
• body28px · 400

見出しテキストには、劇的なインパクトを生むタイトなトラッキングのジオメトリックサンスを使用 · 本文テキストには、読みやすさを重視した十分なline-heightのヒューマニストサンスを使用 · 全テキストはウェイト400（レギュラー）で、落ち着いた洗練された雰囲気を維持

04

余白

豊かな縦方向のパディング（100-300px）により、セクション間に呼吸する余裕を生み出す

05

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

ミニマル。控えめな区切りとして、マットなインクカラーの細いラインを使用

06

レイアウト

フルブリードのヒーロー画像に豊かな縦方向スペーシング、コンテンツは十分なパディングで中央揃え

07

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

インタラクティブ要素の滑らかなtransformとopacityトランジション · 全トランジションは一貫性を保つため0.4秒に統一

0.4秒のトランジションで微細なカラーまたはtransform変化 · transformによる即座のビジュアルフィードバック

08

コンポーネント

• button ミニマルな大文字テキストリンクに、微細なトランジション
• card クリーンで画像を前面に出したプレゼンテーションに、豊かなホワイトスペース
• hero オーバーサイズのブランドタイポグラフィをオーバーレイした、大型のフルブリードフォトグラフィックヒーロー

09

文体と禁止事項

• トーン 洗練された、控えめで上質な
• 見出し 大きなクリーンなタイポグラフィに、ゆったりとしたスペーシング
• CTA ミニマルな大文字テキストリンクに微細なインタラクション

• 彩度の高いアクセントカラーを使用しない — スクリーンショットは完全に彩度を抑えたアーストーンで示されています
• 重いドロップシャドウを追加しない — スクリーンショットはフラットでクリーンなサーフェスで示されています
• 装飾的なセリフ体を使用しない — スクリーンショットはジオメトリックおよびヒューマニストサンセリフフォントで示されています
• 密集したレイアウトを作成しない — スクリーンショットは要素間に豊かなホワイトスペースを示しています
• 明るい白の背景を使用しない — スクリーンショットはウォームオフホワイト（#ECECE4）をメインに使用しています
• 複雑なアニメーションを追加しない — スクリーンショットは微細で滑らかなトランジションを示しています
• 避ける: 派手なカラー
• 避ける: 雑然としたレイアウト
• 避ける: 重いシャドウ
• 避ける: 密集したテキストブロック

10

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

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

11

System Prompt

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