bostondynamics.com ↗
サイトを開く
A leading global robotics company, Boston Dynamics builds practical robotics to tackle your toughest automation challenges and change your idea of what robots can do.
このデザインを再現するAIプロンプト
Cursor / Claude Code / v0 にこのまま貼り付けると、近いトーンのLPが生成できます。
先端技術メーカーのLPを作って。フォントはカスタム/Helvetica系、黒背景に黄色アクセント #ffb500。ヒーローには製品（ロボット）の動画背景をフルスクリーン autoplay loop。スクロールで各製品シリーズが画面いっぱいに展開、それぞれ短いキャッチと動画。CTAは黄色のボタン。工業×SF感。
デザインの特徴
世界最先端ロボットメーカーBoston Dynamics。動画背景でAtlas/Spotロボットの動きを直感的に伝える。黄色 #ffb500 のブランドアクセントが工業/技術感を表現。
Design Tokens（DOM解析データ）
このサイトを 1440×900 でレンダリングして、実際のCSS値から自動抽出した数値データです。「同じ感じ」を再現する材料になります。
カラーロール
Text
#0f0e17Color #1
#0f0e17Color #2
#212121Color #3
#0590c8Color #4
#0000eeColor #5
#5f697cタイポグラフィ
| 要素 | Font | Size | Weight | Line | Tracking |
|---|---|---|---|---|---|
| h1 | Gotham |
72px | 700 | 84.24px | -1.58px |
| h2 | Gotham |
64px | 700 | 76.16px | -1.28px |
| 本文 | Gotham |
18px | 700 | 24px | normal |
| リンク | Gotham |
20px | 400 | 30px | normal |
| ボタン | Gotham |
20px | 400 | 23px | normal |
使用フォント頻度
Gotham757箇所
Arial43箇所
スケール・形状
- 角丸スケール
- 50% / 6px / 2px / 200px / 4px / 20px / 60px / 25px
- シャドウ
- 3パターン使用
- コンテナ幅
- width: 1280px / max-width: none
- ナビゲーション
- 高さ 79px / position: static
wirobotics.com 
starship.xyz 
agilityrobotics.com 