# Eleos｜コーポレートのWebデザイン参考

> 画面いっぱいの社名ロゴ、あとは全部等幅。ロサンゼルスで民間資金の低価格住宅を開発するEleosのサイトは、細身のセリフのワードマークと無骨な等幅体を並べ、理想と実務の両方を語らせている。

- URL: https://www.eleos.la/
- 解説ページ: https://katapick.com/sites/eleos
- カテゴリ: コーポレート / 地域: 海外（US）/ 業種: 不動産開発（アフォーダブル住宅）
- テイスト: 大胆なタイポ、セリフ体、等幅フォント、写真主体、余白
- 公開・リニューアル: 2026-06 / Katapick掲載: 2026-09-30 / 最終確認: 2026-10-30
- 再現難易度: 2/5

## 編集部のひとこと（Luna）
パートナー一覧、番号は小さく薄いグレーで、名前だけを大きく積んでる。等幅1書体なのに、ジャンプ率だけで主従をつけてるのは偉い。書体を増やして逃げてないのがいい。

## デザインの見どころ
- FVは細身のセリフで組んだ社名が横幅いっぱい。残りの文字はすべて等幅で、ロゴだけが柔らかく浮き立つ
- 物件は写真・名称・状況・所在地を同じ型で並べ、「03/13」の表示で何件目かを常に示し続ける
- 背景はクリームと墨色の2色だけ。全面に薄い縦罫が通り、図面のような規律がページを貫く

## 配色
- #f4f4ed Bone（ライトセクション背景 / ヒーローのワードマーク）
- #16151e Ink（ダークセクション背景 / テキスト / フッターのワードマーク）
- #424247 Graphite（本文・説明文）
- #d3d3ce Stone（ダークセクションの本文 / 罫線）
- #282c28 Shade Green（ヒーロー写真の暗部（スクショから採色））

## フォント
- ヒーロー・フッターの社名: ELEOS ワードマーク（細身のセリフ体によるロゴ。SVGと思われる）（代替: Italiana）
- 見出し・本文・ナビ・ボタンのすべて: JB Mono（代替: JetBrains Mono）

## よくある質問
### Eleosのサイトで使われているフォントは？
見出しから本文、ナビまで JB Mono という等幅書体で統一されています。社名の「ELEOS」は細身のセリフ体のロゴで、画像（SVG）として置かれていると思われます。無料で近づけるなら JetBrains Mono と、ロゴ風の表現に Italiana が使えます。

### Eleosのように社名を画面幅いっぱいに置くにはどうする？
ロゴを SVG で用意し、width: 100% と height: auto で配置すると、画面幅に合わせて比率を保ったまま伸縮します。テキストで組む場合は font-size を vw 単位で指定し、letter-spacing を詰めて幅を合わせます。

### Eleosのデザインはどんなサイトの参考になる？
不動産開発、建設、設計事務所、社会インフラ系の企業など、実績の物件を写真と数値で淡々と見せたいBtoBのコーポレートサイトの参考になります。

### Eleosのサイトの写真やロゴを自分のサイトに使ってもいい？
写真、ロゴ、ワードマークなどの素材はEleosおよび各権利者に帰属するため、そのまま使うことはできません。参考にするのは配色や組版、レイアウトの考え方までにとどめてください。

---
セクション別の構成・モーションの実装方法・AI実装プロンプトを含む「デザイン分析MD」は https://katapick.com/sites/eleos からダウンロードできます。
出典: Katapick（https://katapick.com）