厳選・オープン・無料

Norm Store

インダストリアルミニマリズムとハイテク機能性を融合した、プレミアムスマートデスク。

ProductPremiumCleanProductivityRefined
Norm Store のスクリーンショット
↓ デザインシステムをダウンロード (34 MB)OpenDesign で開く

オリジナル: https://norm.store

📦 パックの中身を見る →

01

デザイン DNA

ミニマルインダストリアル機能的スマートモノクロ

家具に変装した建築用ハードウェア

02

カラー

#282828Ink
#ffffffBG
rgba(40,40,40,0.1)Line

純白、黒、ほぼ黒のテキストに依存し、製品のフォルムを強調する厳格なモノクロパレット。

03

タイポグラフィ

geometric-sans · humanist-sans

タイポグラフィは、ウェイトのコントラストよりも、十分な余白に大きく依存する · 見出しは、紧密で建築的な印象のために、tightなline-height 1.0を使用 · 文字間隔は、紧密结合したプレミアムな外観を維持するために、わずかにネガティブ

04

余白

4px
8px
16px
24px
32px
48px
64px
96px

製品写真に十分な余地を優先する、豊かで非対称なスペーシング

05

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

sm · 0px
md · 12px
lg · 0px
pill · 999px

「今すぐ購入」ボタンやクッキーコンセントのようなインタラクティブ要素には、1px solid rgba(40,40,40,1)

06

レイアウト

1280container
12columns
24pxgutter
768 / 1024breakpoints

製品をフレーミングするために余白を多用する、垂直で中央揃えのシングルカラムレイアウト

07

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

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

インタラクティブ要素の控えめなopacityとbackground-colorのトランジション · 状態変化のためのVisibilityのトグル

ボタンの控えめなbackground-colorのシフト · 標準的なポインタイベントによる即座の視覚フィードバック

08

コンポーネント

09

文体と禁止事項

10

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

Norm Store — 桌面首屏（hero）
桌面首屏（hero）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Norm Store — 移动首屏
移动首屏

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

11

System Prompt

このデザインDNAは、スマートデスクのためのプレミアムでミニマルな製品サイトを記述しています。純白（#ffffff）、ほぼ黒のテキスト（#282828）、ボーダー用の二次オフブラックからなる厳格なモノクロパレットを採用しています。タイポグラフィはsans-serifのみで、geometricおよびhumanist-sansカテゴリに依存し、tightな文字間隔-0.4pxと巨大な表示スケール48px+で、自信のある建築的な印象を生み出しています。重要な禁止事項：太字フォントウェイトは決して使用しない（すべてregular 400）、カラフルなアクセントやグラデーションを決して導入しない、製品写真から注意をそらすドロップシャドウやHeavyなUIクロムを決して使用しない。レイアウトは、従来のグリッドベースのカードUIよりも、余白と大きな製品カットアウトを優先する、ゆったりとした中央揃えのシングルカラム構造です。

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

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

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

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