What font does Eclipse Foundation use?

Eclipse Foundation’s website uses three typefaces: Inter (headings and body text), google Fonts; Inconsolata, google Fonts; Roboto, google Fonts.

What are Eclipse Foundation’s brand colours?

The main colours on eclipse.org are Blue (#2C1CD8), Chocolate (#F06C02), Midnight Blue (#000966), Cornflower Blue (#6682F9), Medium Aqua Marine (#44D0AC) and Light Salmon (#FF9B69).

What colour is Eclipse Foundation’s text and background?

Body text is #000000 on a #000000 background.

Where is Eclipse Foundation’s logo from?

The logo shown in this guide was found on eclipse.org’s homepage. For official logo files and usage rules, check Eclipse Foundation’s own brand or press page.

Is this Eclipse Foundation’s official style guide?

No. SiteStyleGuide made it from eclipse.org’s public web pages on 30 October 2026, and isn’t affiliated with Eclipse Foundation. Members can refresh a guide after 90 days to pick up changes.

Unofficial A style guide made by SiteStyleGuide from eclipse.org’s public web pages. Not affiliated with or endorsed by Eclipse Foundation. The real site is eclipse.org ↗

Unofficial style guide

Eclipse Foundationstyle guide

Eclipse Foundation’s website (eclipse.org) uses Inter for its headings and body text. Its palette is led by Blue (#2C1CD8), Chocolate (#F06C02) and Midnight Blue (#000966), with #000000 text on #000000. Captured from the live site on 30 October 2026.

Website: eclipse.org
Typefaces: Inter, Inconsolata, Roboto
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 30 Oct 2026 · added by @sitestyleguide

Save Add to collection Share Report

Screenshot of the eclipse.org homepage on a desktop screen — Screenshot of eclipse.org on a 1440 px desktop screen, 30 Oct 2026.

Screenshot of the eclipse.org homepage on a phone — On a phone, 390 px.

Identity & metadata

What browsers, search engines and social cards show before anyone reaches the page, from the homepage’s <head>.

Title &
description

Page title: Eclipse Foundation | Powering Open Innovation; ● 45 / 60 characters
Meta description: The Eclipse Foundation hosts 450+ open source projects with vendor-neutral governance, enabling global collaboration in automotive, IoT, cloud, and emerging …; ● 158 / 160 characters
Site name: Eclipse Foundation
og:title: Eclipse Foundation | Powering Open Innovation
og:description: The Eclipse Foundation hosts 450+ open source projects with vendor-neutral governance, enabling global collaboration in automotive, IoT, cloud, and emerging …
Language: en

In search results

Eclipse Foundationhttps://www.eclipse.org/

Eclipse Foundation | Powering Open Innovation

The Eclipse Foundation hosts 450+ open source projects with vendor-neutral governance, enabling global collaboration in automotive, IoT, cloud, and emerging …

When shared

The image Eclipse Foundation shares with links

eclipse.org

Eclipse Foundation | Powering Open Innovation

The Eclipse Foundation hosts 450+ open source projects with vendor-neutral governance, enabling global collab…

Logo & favicons

Found as: image in the header. SVG, 282 × 91.

Logo

On white

On black

On Blue

Favicons

1 found

48 px · ICO icon

Eclipse Foundation | Powering Open Innovation

Light browser tab

Eclipse Foundation | Powering Open Innovation

Dark browser tab

Colour

Read from the site’s stylesheets and weighted by where each colour is used. Names are the nearest standard colour name. Click a swatch to copy its hex code.

Contrast is against the site’s text colour (#000000) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

White 31%
Black 12.1%
Blue 10.9%
Chocolate 7.4%
Off White 7.3%
Midnight Blue 5.4%
Grey 4.4%
Cornflower Blue 3.5%
Medium Aqua Marine 3.2%
Light Salmon 3%
Dark Golden Rod 2.3%
Dark Olive Green 2.1%
Brown 2.1%
Yellow 2%
Steel Blue 1.7%
Coral 1.7%

By how often each colour appears in the site’s CSS, weighted by where (body, headings, buttons), not by area on the screen.

Neutrals

Text, backgrounds and structure

White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 0

On text
21.00:1 AAA

On white
—

Text, background, border · .btn-success .badge, .btn-info .badge
Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 100

On text
—

On white
21.00:1 AAA

Text, background, border · html, body
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 13

On text
15.46:1 AAA

On white
1.36:1 Fail

Background, border, text · .panel-default>.panel-heading, .nav .nav-divider
Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 53

On text
4.69:1 AA

On white
4.48:1 AA large

Text, background · h1 small, .newsroom-resources .tpl-cover .newsroom-resource-section-title small

Colours

Brand colours and accents, most used first

Blue

HEX

RGB

HSL

OKLCH

CMYK
80 87 0 15

On text
2.26:1 Fail

On white
9.27:1 AAA

Background, text, border · .btn-secondary, a
Chocolate

HEX

RGB

HSL

OKLCH

CMYK
0 55 99 6

On text
6.85:1 AA

On white
3.07:1 AA large

Background, text, border · .panel-primary>.panel-heading, .btn-primary
Midnight Blue

HEX

RGB

HSL

OKLCH

CMYK
100 91 0 60

On text
1.23:1 Fail

On white
17.06:1 AAA

Text, background, border · .btn-tertiary, .btn-outline-tertiary
Cornflower Blue

HEX

RGB

HSL

OKLCH

CMYK
59 48 0 2

On text
6.13:1 AA

On white
3.43:1 AA large

Background, text, border · .btn-info, .btn-info .badge
Medium Aqua Marine

HEX

RGB

HSL

OKLCH

CMYK
67 0 17 18

On text
10.86:1 AAA

On white
1.93:1 Fail

Background, text, border · .btn-success, .btn-success .badge
Light Salmon

HEX

RGB

HSL

OKLCH

CMYK
0 39 59 0

On text
10.14:1 AAA

On white
2.07:1 Fail

Background, text, border · .btn-warning, .btn-warning .badge
Dark Golden Rod

HEX

RGB

HSL

OKLCH

CMYK
0 21 57 46

On text
4.33:1 AA large

On white
4.85:1 AA

Text, background, border · .panel-warning>.panel-heading .badge, .panel-warning>.panel-heading
Dark Olive Green

HEX

RGB

HSL

OKLCH

CMYK
49 0 48 54

On text
3.85:1 AA large

On white
5.45:1 AA

Text, background, border · .panel-success>.panel-heading .badge, .panel-success>.panel-heading
Brown

HEX

RGB

HSL

OKLCH

CMYK
0 60 61 34

On text
3.59:1 AA large

On white
5.85:1 AA

Text, background, border · .panel-danger>.panel-heading .badge, .panel-danger>.panel-heading
Yellow

HEX

RGB

HSL

OKLCH

CMYK
0 0 100 0

On text
19.56:1 AAA

On white
1.07:1 Fail

Background, text · .btn:focus:focus-visible, .nav.nav-tabs li a:focus-visible
Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
66 22 0 44

On text
3.84:1 AA large

On white
5.46:1 AA

Text, background, border · .panel-info>.panel-heading .badge, .panel-info>.panel-heading
Coral

HEX

RGB

HSL

OKLCH

CMYK
0 53 79 0

On text
8.04:1 AAA

On white
2.61:1 Fail

Background, border · .btn-warning:hover, .btn-warning:active

Gradients

linear-gradient(45deg,#ffffff26 25%,#0000 25% 50%,#ffffff26 50% 75%,#0000 75%,#0000)
linear-gradient(#6682f9,#2c1cd8)
linear-gradient(#f06c02,#a34201)

Dark mode

Switched on by the site

White

#FFFFFF
Midnight Blue

#000966
Blue

#2C1CD8
Chocolate

#F06C02
Black

#000000
Cornflower Blue

#6682F9
Medium Aqua Marine

#44D0AC
Light Salmon

#FF9B69
Midnight Blue

#000429
Dark Blue

#2115A2
Saddle Brown

#A34201
Midnight Blue

#000433

Typography

Faces from Google Fonts are shown in the real thing. Others are licensed to the site, so they show in your device’s copy if you have one, or a stand-in if not.

Inter

Aa 200 Aa 900

Inter

Google Fonts · weights 200, 300, 400, 500, 700, 900 · headings, body, buttons

Aa 200 Aa 900

Inconsolata

Google Fonts · weights 200, 900

Aa 100 Aa 900

Roboto

Google Fonts · weights 100, 300, 400, 500, 700, 900 · buttons

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 ! ? & @ % $ – ’ “ ”

Type scale

From the site’s CSS · root 10 px

Heading 1 3.6rem · 36 px / 1.1 weight 700 · Inter

Eclipse Foundation

Heading 2 3rem · 30 px / 1.1 weight 700 · Inter

Eclipse Foundation | Powering Open Innovation

Heading 3 2.6rem · 26 px / 1.1 weight 700 · Inter

Eclipse Foundation | Powering Open Innovation

Heading 4 2.2rem · 22 px / 1.1 weight 700 · Inter

Eclipse Foundation | Powering Open Innovation

Heading 5 1.4rem · 14 px / 1.1 weight 500 · Inter

Eclipse Foundation | Powering Open Innovation

Heading 6 1.2rem · 12 px / 1.1 weight 500 · Inter

Eclipse Foundation | Powering Open Innovation

Body 1.6rem · 16 px / 1.42857 Inter

The Eclipse Foundation hosts 450+ open source projects with vendor-neutral governance, enabling global collaboration in automotive, IoT, cl…

Paragraph 13px weight 400 · none

The Eclipse Foundation hosts 450+ open source projects with vendor-neutral governance, enabling global collaboration in automotive, IoT, cl…

Small 88%

The Eclipse Foundation hosts 450+ open source projects with vendor-neutral governance, enabling global collaboration in automotive, IoT, cl…

Link 2rem · 20 px / 1.5 weight 400 · uppercase · Inter

Sizes in use

Most common across the site

30pxline 1.1 · 7 rules
24pxline inherit · 6 rules
20pxline 1.33333 · 21 rules
18pxline 1.42857 · 18 rules
16pxline 1.5 · 30 rules
14px9 rules
12px5 rules
10px5 rules

Elements

The main button and link as the site’s CSS draws them, and the corner radii and shadows it uses most.

Elements

Button

Get started

.btn-primary · #F06C02

Link

Read our latest news today.

a · #2C1CD8

Corner radius

9999px · 10×
6px · 9×
2.4rem · 9×
3px · 7×
50% · 7×
1.6rem · 7×

Shadows

unset
0 4px 10px #0000001a
0 6px 12px #0000002d
0 1px 1px #0000000d

Layout

Breakpoints from the site’s media queries and the widths its content is held to, with how often each appears.

Grid

Content widths (max-width)

585 px

512 px

480 px

416 px

384 px

320 px

Notes

Plain checks on what was found. Worth fixing if you look after this site.

Notes

● FineThe title is 45 characters, short enough to show in full in search results.
▲ CheckBody text (#000000 on #000000) has a contrast of 1.00:1, under the 4.5:1 WCAG asks for.

Questions

Quick answers, from the same capture as the rest of this guide.

Questions

What font does Eclipse Foundation use?: Eclipse Foundation’s website uses three typefaces: Inter (headings and body text), google Fonts; Inconsolata, google Fonts; Roboto, google Fonts.
What are Eclipse Foundation’s brand colours?: The main colours on eclipse.org are Blue (#2C1CD8), Chocolate (#F06C02), Midnight Blue (#000966), Cornflower Blue (#6682F9), Medium Aqua Marine (#44D0AC) and Light Salmon (#FF9B69).
What colour is Eclipse Foundation’s text and background?: Body text is #000000 on a #000000 background.
Where is Eclipse Foundation’s logo from?: The logo shown in this guide was found on eclipse.org’s homepage. For official logo files and usage rules, check Eclipse Foundation’s own brand or press page.
Is this Eclipse Foundation’s official style guide?: No. SiteStyleGuide made it from eclipse.org’s public web pages on 30 October 2026, and isn’t affiliated with Eclipse Foundation. Members can refresh a guide after 90 days to pick up changes.

Design tokens

Everything above as CSS variables, ready to paste into a project. Members can download the tokens as files for Figma (Tokens Studio), Style Dictionary and Tailwind.

Tokens

eclipse-org-tokens.css

Download

Free with an account: sign up or sign in, and you’ll come straight back here.

/* eclipse.org design tokens, from SiteStyleGuide (https://sitestyleguide.com/eclipse.org) */
:root {
  /* Colours */
  --text: #000000;
  --background: #000000;
  --colour-white: #FFFFFF;
  --colour-black: #000000;
  --colour-off-white: #DDDDDD;
  --colour-grey: #777777;
  --colour-blue: #2C1CD8;
  --colour-chocolate: #F06C02;
  --colour-midnight-blue: #000966;
  --colour-cornflower-blue: #6682F9;
  --colour-medium-aqua-marine: #44D0AC;
  --colour-light-salmon: #FF9B69;
  --colour-dark-golden-rod: #8A6D3B;
  --colour-dark-olive-green: #3C763D;
  --colour-brown: #A94442;
  --colour-yellow: #FFFF00;
  --colour-steel-blue: #31708F;
  --colour-coral: #FF7936;
  --gradient-1: linear-gradient(45deg,#ffffff26 25%,#0000 25% 50%,#ffffff26 50% 75%,#0000 75%,#0000);
  --gradient-2: linear-gradient(#6682f9,#2c1cd8);
  --gradient-3: linear-gradient(#f06c02,#a34201);

  /* Typefaces */
  --font-headings: 'Inter', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-buttons: 'Inter', sans-serif;
  --font-other: 'Inconsolata', monospace;

  /* Type scale */
  --text-h1: 3.6rem;
  --leading-h1: 1.1;
  --text-h2: 3rem;
  --leading-h2: 1.1;
  --text-h3: 2.6rem;
  --leading-h3: 1.1;
  --text-h4: 2.2rem;
  --leading-h4: 1.1;
  --text-h5: 1.4rem;
  --leading-h5: 1.1;
  --text-h6: 1.2rem;
  --leading-h6: 1.1;
  --text-body: 1.6rem;
  --leading-body: 1.42857;
  --text-p: 13px;
  --text-small: 88%;
  --text-a: 2rem;
  --leading-a: 1.5;

  /* Shape */
  --radius-1: 9999px;
  --radius-2: 6px;
  --radius-3: 2.4rem;
  --radius-4: 3px;
  --radius-5: 50%;
  --radius-6: 1.6rem;
}

{
    "site": "eclipse.org",
    "source": "https://sitestyleguide.com/eclipse.org",
    "text": "#000000",
    "background": "#000000",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Black",
            "hex": "#000000",
            "rgb": [
                0,
                0,
                0
            ]
        },
        {
            "name": "Off White",
            "hex": "#DDDDDD",
            "rgb": [
                221,
                221,
                221
            ]
        },
        {
            "name": "Grey",
            "hex": "#777777",
            "rgb": [
                119,
                119,
                119
            ]
        },
        {
            "name": "Blue",
            "hex": "#2C1CD8",
            "rgb": [
                44,
                28,
                216
            ]
        },
        {
            "name": "Chocolate",
            "hex": "#F06C02",
            "rgb": [
                240,
                108,
                2
            ]
        },
        {
            "name": "Midnight Blue",
            "hex": "#000966",
            "rgb": [
                0,
                9,
                102
            ]
        },
        {
            "name": "Cornflower Blue",
            "hex": "#6682F9",
            "rgb": [
                102,
                130,
                249
            ]
        },
        {
            "name": "Medium Aqua Marine",
            "hex": "#44D0AC",
            "rgb": [
                68,
                208,
                172
            ]
        },
        {
            "name": "Light Salmon",
            "hex": "#FF9B69",
            "rgb": [
                255,
                155,
                105
            ]
        },
        {
            "name": "Dark Golden Rod",
            "hex": "#8A6D3B",
            "rgb": [
                138,
                109,
                59
            ]
        },
        {
            "name": "Dark Olive Green",
            "hex": "#3C763D",
            "rgb": [
                60,
                118,
                61
            ]
        },
        {
            "name": "Brown",
            "hex": "#A94442",
            "rgb": [
                169,
                68,
                66
            ]
        },
        {
            "name": "Yellow",
            "hex": "#FFFF00",
            "rgb": [
                255,
                255,
                0
            ]
        },
        {
            "name": "Steel Blue",
            "hex": "#31708F",
            "rgb": [
                49,
                112,
                143
            ]
        },
        {
            "name": "Coral",
            "hex": "#FF7936",
            "rgb": [
                255,
                121,
                54
            ]
        }
    ],
    "fonts": [
        {
            "name": "Inter",
            "stack": "Inter, sans-serif",
            "weights": [
                200,
                300,
                400,
                500,
                700,
                900
            ],
            "source": "Google Fonts"
        },
        {
            "name": "Inconsolata",
            "stack": "Inconsolata, monospace",
            "weights": [
                200,
                900
            ],
            "source": "Google Fonts"
        },
        {
            "name": "Roboto",
            "stack": "Roboto, sans-serif",
            "weights": [
                100,
                300,
                400,
                500,
                700,
                900
            ],
            "source": "Google Fonts"
        }
    ]
}

Other websites using Inter as their main typeface

ITFixio

itfixio.co.uk · set in Inter
Save1
IGN

ign.com · set in Inter
Save
Deezer

deezer.com · set in Inter
Save
AI-Native Cloud

digitalocean.com · set in Inter
Save

Websites whose lead colour is closest to Eclipse Foundation’s

craigslist

craigslist.org · 4 days ago
Save
VectorStock

vectorstock.com · 3 days ago
Save
elegantthemes.com

elegantthemes.com · 4 days ago
Save
The Motley Fool

fool.com · 4 days ago
Save

Captured from eclipse.org on 30 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Eclipse Foundation; this guide describes the public website for reference.

Eclipse Foundationstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Black

Off White

Grey

Colours

Blue

Chocolate

Midnight Blue

Cornflower Blue

Medium Aqua Marine

Light Salmon

Dark Golden Rod

Dark Olive Green

Brown

Yellow

Steel Blue

Coral

Gradients

Dark mode

Inter

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run eclipse.org?

Also set in Inter

ITFixio

IGN

Deezer

AI-Native Cloud

Similar colours

craigslist

VectorStock

elegantthemes.com

The Motley Fool

Title &
description