厳選・オープン・無料

Heylow

目的主導の組織のためのデザイン＆コード・パートナー。その仕事と同様に、熟慮された姿で存在できるよう支援します。

AgencyCleanBold TypographyPremiumCalm
Heylow のスクリーンショット
↓ デザインシステムをダウンロード (10 MB)OpenDesign で開く

オリジナル: https://heylow.world

📦 パックの中身を見る →

01

デザイン DNA

デザインコードパートナー目的主導低炭素永続性

デザインとデジタル実装の両面で、明瞭さ、エレガンス、サステナビリティを重視する、ハイエンドで目的意識の強いクリエイティブ・スタジオ。

02

カラー

#faf8f3Ink
#a8a3a1Ink soft
#0f0e0cBG
#4a4643Muted
rgba(74, 70, 67, 1.0)Line

明瞭さと集中力を高めるための、ダークで温かみのある土着的なモノクロム・パレットと、高コントラストのテキストを採用。

03

タイポグラフィ

humanist-sans

大きなディスプレイ・テキストには、洗練されモダンな印象を与えるタイトなトラッキングを適用。 · 本文テキストには十分な行間（1.6）を維持し、可読性を確保。 · ナビゲーションや小さなラベルには、幅広な文字間隔を付けた大文字表記を採用。 · すべてのタイポグラフィは、落ち着きのある統一感を出すため、ウェイト400を維持。

04

余白

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

すべてのスペーシングに一貫した4pxの基本グリッドを採用し、構造的で予測可能なレイアウトのリズムを実現。

05

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

sm · 4px
md · 8px
lg · 12px
pill · 999px

レイアウトを構造化し、インタラクティブ・ゾーンを定義するために、重い視覚的重みを持たせない薄い1pxのボーダーを、落ち着いた土着色（#4a4643 または #faf8f3）で使用。

06

レイアウト

1280container
12columns
24pxgutter
768 / 1024breakpoints

点線のボーダー・ラインで明確に示される、強固なグリッド構造が、建築的な精緻さを強調。

07

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

200msmicro
200mssmall
500msmedium
cubic-bezier(0.4, 0.0, 0.2, 1)easing

hover時の繊細な不透明度の遷移。 · メニュー操作時の滑らかなフェードイン/アウト。 · コンテンツから注意を逸らさない、最小限で目的に即した動き。

インタラクティブ性を示すための繊細な不透明度の変化。 · 最小限のアニメーションによる即座のフィードバック。

08

コンポーネント

09

文体と禁止事項

10

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

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

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

11

System Prompt

これはHeylowというデザイン＆コード・パートナー・エージェシーのポートフォリオ・ウェブサイトです。デザインは、落ち着き、洗練、そして熟慮された美学が特徴です。主要カラーは、ダークで温かみのあるブラック（#0f0e0c）の背景に、ライトで温かみのあるオフホワイト（#faf8f3）のテキスト、そして落ち着いたグレーのアクセント（#a8a3a1, #4a4643）です。タイポグラフィには、クリーンでヒューマニストなサンセリフ・フォント・ファミリを様々なウェイトで使用し、ワードマークには太くオーバーサイズのディスプレイ・タイプを重点的に使用しています。レイアウトは空間的でグリッド・ベースであり、明確な構造線が可见です。重要な禁止事項：明るく彩度の高いアクセントカラーを使用しない；装飾的あるいはスクリプト・フォントを使用しない；不要な要素や重い視覚効果でインターフェースを詰め込まない；本文テキストに大文字表記を使用しない；重いドロップ・シャドウを使用しない；複雑でごちゃごちゃしたレイアウトを使用しない。

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

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

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

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