厳選・オープン・無料

Magnetism Fr

戦略、アートディレクション、プロダクションを融合したパリ拠点のラグジュアリー・クリエイティブ・エージェンシーです。

AgencyPremiumTypographyCleanEditorial
Magnetism Fr のスクリーンショット
↓ デザインシステムをダウンロード (49 MB)OpenDesign で開く

オリジナル: https://www.magnetism.fr/en

📦 パックの中身を見る →

01

デザイン DNA

クリエイティブエージェンシーラグジュアリーパリミニマリストマグネティック

磁場のようなもの—構造化され、力強く、あなたを引き寄せます。

02

カラー

#1A5AFFAccent
#222222Ink
#343434Ink soft
#ECECECBG
#AAAAAAMuted
rgba(229, 231, 235, 1)Line

大胆なタイポグラフィを優先し、鮮やかなイメージを主なアクセントとして機能させる、抑制の効いた高コントラストのパレットです。

03

タイポグラフィ

geometric-sans · grotesque-sans

大文字の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

コンポーネント

09

文体と禁止事項

10

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

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

11

System Prompt

これはMagnetismのためのハイエンドなクリエイティブエージェンシーポートフォリオです。デザインは極端なタイポグラフィのコントラストによって定義されます:巨大な幾何学的サンセリフの見出し(「MAGNETISM」など)が、抑制されたニュートラルな背景(#ECECEC)と暗いインクのテキスト(#222222)を背景にビューポートを支配します。レイアウトはミニマリストでゆったりとしており、大判のシネマティックな写真がビジュアルナラティブを駆動します。ナビゲーションとメタデータは、小さな、広い字間隔の大文字のグロテスク・サンセリフ・テキストで処理されます。インタラクションは滑らかで控えめで、0.5s cubic-bezierの透明度フェードに依存します。重要な禁止事項:決して角丸、ドロップシャドウ、またはカジュアルな小文字の見出しを使用しない。常に広い余白と严格的なアライメントを優先し、高級で洗練されたエージェンシーの美学を維持すること。

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック(エージェント用) ↗

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