厳選・オープン・無料
Magnetism Fr
戦略、アートディレクション、プロダクションを融合したパリ拠点のラグジュアリー・クリエイティブ・エージェンシーです。
AgencyPremiumTypographyCleanEditorial
01
デザイン DNA
クリエイティブエージェンシーラグジュアリーパリミニマリストマグネティック
磁場のようなもの—構造化され、力強く、あなたを引き寄せます。
02
カラー
#1A5AFFAccent
#222222Ink
#343434Ink soft
#ECECECBG
#AAAAAAMuted
rgba(229, 231, 235, 1)Line
大胆なタイポグラフィを優先し、鮮やかなイメージを主なアクセントとして機能させる、抑制の効いた高コントラストのパレットです。
03
タイポグラフィ
geometric-sans · grotesque-sans
- display
120px · 400 - h1
27px · 400 - body
16px · 400 - small
10px · 400
大文字のUIやメタテキストには広い文字間隔を使用する · 巨大なディスプレイ・タイポグラフィには tighten された行間を維持する · ナビゲーションやカテゴリラベルにはすべて大文字が標準である
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
大規模なレイアウトのために十分な垂直リズムを持つ、標準的な4pxグリッド。
05
サーフェス (角丸 / 影 / 罫線)
sm · 0px
md · 0px
lg · 0px
pill · 999px
薄く繊細なボーダー(rgb(229, 231, 235))を使用してコンテンツブロックを区切ります。
なし
06
レイアウト
1440container
12columns
24pxgutter
768 / 1024breakpoints
ミニマリストでトップヘビーなレイアウト。画面の端々にまで滲み込むような巨大なタイポグラフィが特徴で、フルワイドのシネマティックなイメージと組み合わされます。
07
モーションとインタラクション
220msmicro
400mssmall
800msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing
ページ要素のための滑らかな透明度フェードと遷移 · スクロール時のイメージに対する微細なスケールやリビール効果
テキストリンクに対する微細な透明度の変化やカーソルの移動。 · 透明度や微細な移動による即座のビジュアルフィードバック。
08
コンポーネント
- button ミニマリストな大文字テキストリンクで、しばしば小さな幾何学的な矢印が両側にあります。
- card エッジ・トゥ・エッジの写真カードで、下部にシンプルなテキストオーバーレイがあります。
- chip 該当なし
- input 該当なし
- hero 巨大なタイポグラフィのステートメントの直後に、高インパクトのフルワイドビジュアルが続きます。
09
文体と禁止事項
- トーン 自信に満ち、洗練され、権威があります。
- 見出し すべての大文字、ウルトラ・ボールドで広がりのある字体で、注意を引くためにしばしば単一の単語を使用します。
- CTA 控えめでエレガントな、方向矢印付きの小さな大文字テキスト。
- カラフルなグラデーションを使用しない—スクリーンショットでは#ECECECのようなフラットで単色の背景が示されています
- 角丸を使用しない—スクリーンショットではすべての要素に0pxのシャープな角が示されています
- ドロップシャドウを使用しない—スクリーンショットでは完全にフラットで影のないサーフェスが示されています
- 混合ケースの見出しを使用しない—スクリーンショットでは見出しにtextTransformの大文字が積極的に使用されています
- 見出しに広いマージンを使用しない—スクリーンショットでは巨大なディスプレイ・タイプが画面の端近くにまで滲み出しています
- 鮮やかなUIボタンを使用しない—スクリーンショットでは微細な矢印付きのミニマリストでテキストのみのナビゲーションリンクが示されています
- 避ける: 派手または混沌としたカラースキーム
- 避ける: 装飾的または過度に華やかなタイポグラフィ
- 避ける: 過度なUI要素を含むごちゃごちゃしたレイアウト
- 避ける: 非公式またはカジュアルな言葉遣い
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
これはMagnetismのためのハイエンドなクリエイティブエージェンシーポートフォリオです。デザインは極端なタイポグラフィのコントラストによって定義されます:巨大な幾何学的サンセリフの見出し(「MAGNETISM」など)が、抑制されたニュートラルな背景(#ECECEC)と暗いインクのテキスト(#222222)を背景にビューポートを支配します。レイアウトはミニマリストでゆったりとしており、大判のシネマティックな写真がビジュアルナラティブを駆動します。ナビゲーションとメタデータは、小さな、広い字間隔の大文字のグロテスク・サンセリフ・テキストで処理されます。インタラクションは滑らかで控えめで、0.5s cubic-bezierの透明度フェードに依存します。重要な禁止事項:決して角丸、ドロップシャドウ、またはカジュアルな小文字の見出しを使用しない。常に広い余白と严格的なアライメントを優先し、高級で洗練されたエージェンシーの美学を維持すること。
en · zh-CN · zh-TW · ja · ko