厳選・オープン・無料

Hugging Face

AIコミュニティがモデル、データセット、アプリを共同開発するための、フレンドリーで高実用性のプラットフォーム。

01

デザイン DNA

機械学習エンジニアと研究者のための活気あるデジタル広場。

02

カラー

明るいグレーの細いボーダーを備えたクリーンな白い背景。ヒーローセクションではダークネイビーのグラデーションでアンカーを取る。

03

タイポグラフィ

humanist-sans · monospace

• display56px · 700
• h132px · 700
• h220px · 600
• body16px · 400
• caption12px · 400

04

余白

Tight 4px マイクロスペーシングを含む、一貫した8pxグリッド。

05

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

1px solid #E5E7EB

rgba(0, 0, 0, 0.1) 0px 1px 2px 0px · rgba(0, 0, 0, 0.1) 0px 1px 3px 0px · rgba(0, 0, 0, 0.1) 0px 20px 25px -5px

06

レイアウト

モバイルでは単一カラムに折りたたまれる、標準的なレスポンシブ12カラムグリッド。

07

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

ホバー時の微細なカラートランジション · インタラクティブ要素のスケールおよびトランスレートトランスフォーム

0.15s easeで背景を明るくする、またはボーダーカラーを変更。 · 微細なスケールダウントランスフォーム。

08

コンポーネント

• button 白文字と丸みのある角（pill radius）を持つダークネイビーの塗りつぶしボタン、またはボーダー付きの透明ボタン。
• card 明るいグレーのボーダーと12pxのボーダー半径を持つ白いカード。機能や組織リストに使用。
• chip タスクやライブラリなどのカテゴリ用の、明るいグレーの背景を持つ小さな丸みのあるタグ。
• input 明るいグレーのボーダーと内部パディングを持つ、丸みのある検索フィールド。
• hero ダークネイビーからブラックへのグラデーション背景に、大きな白文字と目立つマスコット。

09

文体と禁止事項

• トーン フレンドリー、コラボレーティブ、かつ技術的に正確。
• 見出し コミュニティと構築を強調する、太字の宣言的なステートメント。
• CTA 直接的でアクション指向（例：「探す」「閲覧」）。

• 攻撃的なネオンアクセントは使用しない。パレットはネイビー、グレー、白に依存。
• 重いドロップシャドウは使用しない。カードには微細なエレベーションのみ。
• 長い段落のテキストを中央揃えにしない。配置は左揃え。
• すべての要素に完全な丸みのある角を使用しない。8pxとピル（pill）形状を混合使用。
• 複雑なイラストは使用しない。UIはクリーンなアイコンと単一のマスコットに依存。
• デフォルトでダークモードを使用しない。プライマリエクスペリエンスはライトモードで、ヒーローがダーク。
• 避ける: 過度に企業的なジャーゴン
• 避ける: 攻撃的な販売言語
• 避ける: プライマリUIにおける複雑な学術用語

10

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

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

11

System Prompt

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