厳選・オープン・無料

Aletagency

キュレーションされた、エディトリアルなデジタルプレゼンスを持つ、コペンハーゲン拠点のクリエイティブスタジオおよびプロダクションハウス。

01

デザイン DNA

キュレーションされたハイエンドポートフォリオとして機能するデジタルムードボード

02

カラー

控えめな自然の中間色の背景と、ハイコントラストの黒タイポグラフィ。

03

タイポグラフィ

transitional-serif · humanist-sans

• display23px · 400
• body11px · 400

ナビゲーションとラベルには広めの文字間隔を使用する · 表現力のあるヒーローモーメントにはセリフ体をreservedする

04

余白

コアコンテンツの周りに巨大な余白を設けた、豊かな垂直リズム

05

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

最小限で、区切りには余白に依存する

rgba(0, 0, 0, 0.1) 0px 1px 3px 0px · rgba(0, 0, 0, 0.06) 0px 1px 2px 0px

06

レイアウト

豊かなパディングを持つセンタリングされたコンテンツと、メーソンリスタイルの画像配置

07

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

ドラッグ可能なギャラリーを示すためにカーソルが「grab」に変化する

インタラクティブなテキスト要素の微細なカラー変化 · メインギャラリーでのドラッグして探索するインタラクション

08

コンポーネント

• button 最小限の、タイポグラフィベースのナビゲーションリンク
• card オーバーサイズの、微細なボーダーを持つ写真カード
• chip ビューモード（Linear/Random）用のシンプルなピル型トグル
• hero センタリングされたテキストステートメントを持つ、プロジェクト画像の動的でオーバーラップするグリッド

09

文体と禁止事項

• トーン プロフェッショナルで洗練され、控えめ
• 見出し セリフベースの、少し詩的なステートメント
• CTA クリーンな、サンセリフの、大文字ラベル

• 明るいアクセントカラーを使用しない — スクリーンショットは厳格に控えめな、自然なパレットを示している
• 重いドロップシャドウを適用しない — スクリーンショットは最小限の、柔らかなエレベーションのみを示している
• 画像に厳格なグリッドを使用しない — スクリーンショットは動的でオーバーラップするレイアウトを示している
• 装飾的なサンセリフフォントを使用しない — スクリーンショットはUIに機能的なヒューマニストサンセリフを使用している
• インターフェースを雑然とさせない — スクリーンショットは巨大な余白と余裕を優先している
• 過度に全角大文字を使用しない — スクリーンショットはそれをナビゲーションとトグルに厳格にreservedしている
• 避ける: 目立つマーケティング用語
• 避ける: 複雑なレイアウトパターン
• 避ける: 雑然としたインターフェース

10

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

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

11

System Prompt

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