What font does AI-Native Cloud use?

AI-Native Cloud’s website uses three typefaces: Inter (body text), self-hosted; Plus Jakarta Sans (headings), self-hosted; JetBrains Mono, self-hosted.

What are AI-Native Cloud’s brand colours?

The main colours on digitalocean.com are Slate Grey (#104B55), Dark Turquoise (#6FE0ED), Dark Khaki (#94A54B), Olive Drab (#879B42), Dodger Blue (#2E85E0) and Steel Blue (#1E7ADB).

What colour is AI-Native Cloud’s text and background?

Body text is #000000 on a #000000 background.

Where is AI-Native Cloud’s logo from?

The logo shown in this guide was found on digitalocean.com’s homepage. For official logo files and usage rules, check AI-Native Cloud’s own brand or press page.

Is this AI-Native Cloud’s official style guide?

No. SiteStyleGuide made it from digitalocean.com’s public web pages on 2 November 2026, and isn’t affiliated with AI-Native Cloud. Members can refresh a guide after 90 days to pick up changes.

Unofficial A style guide made by SiteStyleGuide from digitalocean.com’s public web pages. Not affiliated with or endorsed by AI-Native Cloud. The real site is digitalocean.com ↗

Unofficial style guide

AI-Native Cloudstyle guide

AI-Native Cloud’s website (digitalocean.com) sets its headings in Plus Jakarta Sans and its body text in Inter. Its palette is led by Slate Grey (#104B55), Dark Turquoise (#6FE0ED) and Dark Khaki (#94A54B), with #000000 text on #000000. Captured from the live site on 2 November 2026.

Website: digitalocean.com
Typefaces: Inter, Plus Jakarta Sans, JetBrains Mono
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 2 Nov 2026 · added by @sitestyleguide

Save Add to collection Share Report

Screenshot of the digitalocean.com homepage on a desktop screen — Screenshot of digitalocean.com on a 1440 px desktop screen, 2 Nov 2026.

Screenshot of the digitalocean.com 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: AI-Native Cloud | DigitalOcean; ● 30 / 60 characters
Meta description: Run AI products in production with a unified stack for agents, inference, and cloud—built for control, performance, and economics at scale.; ● 139 / 160 characters
og:title: AI-Native Cloud | DigitalOcean
og:description: Run AI products in production with a unified stack for agents, inference, and cloud—built for control, performance, and economics at scale.
Language: en
Theme colour: #000000

In search results

AI-Native Cloudhttps://www.digitalocean.com/

AI-Native Cloud | DigitalOcean

Run AI products in production with a unified stack for agents, inference, and cloud—built for control, performance, and economics at scale.

When shared

No og:image, so no picture

digitalocean.com

AI-Native Cloud | DigitalOcean

Run AI products in production with a unified stack for agents, inference, and cloud—built for control, perfor…

Logo & favicons

Found as: SVG in the header. SVG, 90 × 90.

Logo

On white

On black

On Slate Grey

Favicons

3 found

180 px · PNG apple-touch-icon
48 px · ICO icon
32 px · SVG icon

AI-Native Cloud | DigitalOcean

Light browser tab

AI-Native Cloud | DigitalOcean

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

Off White 20.1%
Slate Grey 16.7%
Dark Turquoise 16.1%
Black 14%
Cool Near Black 9.6%
Cool Light Grey 5.4%
Dark Khaki 2.1%
Olive Drab 2.1%
Dodger Blue 2.1%
Steel Blue 2.1%
Slate Grey 1.9%
Deep Teal 1.9%
Deep Slate Grey 1.8%
Cadet Blue 1.8%
Light Slate Grey 1.3%
Light Teal 1.1%

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

Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 4

On text
19.23:1 AAA

On white
1.09:1 Fail

Text, background, border · body, .iMWrUY.button-link.is-primary
Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 100

On text
—

On white
21.00:1 AAA

Text, background, theme · body, .iMWrUY.button-link.is-primary.is-outlined:disabled
Cool Near Black

HEX

RGB

HSL

OKLCH

CMYK
100 0 0 94

On text
1.08:1 Fail

On white
19.53:1 AAA

Background, text · .iMWrUY.button-link.is-primary:disabled, .iMWrUY.button-link.is-primary.is-outlined:disabled
Cool Light Grey

HEX

RGB

HSL

OKLCH

CMYK
6 0 1 16

On text
14.05:1 AAA

On white
1.49:1 Fail

Background · .iMWrUY.button-link.is-primary:disabled, .iMWrUY.button-link.is-primary.is-outlined:disabled

Colours

Brand colours and accents, most used first

Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
81 12 0 67

On text
2.16:1 Fail

On white
9.72:1 AAA

Text, border, background · .iMWrUY.button-link, .iMWrUY.button-link.is-primary.is-outlined
Dark Turquoise

HEX

RGB

HSL

OKLCH

CMYK
53 5 0 7

On text
13.56:1 AAA

On white
1.55:1 Fail

Text, border, background · .iMWrUY.button-link, .iMWrUY.button-link.is-primary.is-outlined
Dark Khaki

HEX

RGB

HSL

OKLCH

CMYK
10 0 55 35

On text
7.74:1 AAA

On white
2.71:1 Fail

Background · .iMWrUY.button-link.is-green, .jjFalE.button-link.is-green
Olive Drab

HEX

RGB

HSL

OKLCH

CMYK
13 0 57 39

On text
6.80:1 AA

On white
3.09:1 AA large

Background · .iMWrUY.button-link.is-green, .jjFalE.button-link.is-green
Dodger Blue

HEX

RGB

HSL

OKLCH

CMYK
79 41 0 12

On text
5.55:1 AA

On white
3.79:1 AA large

Background · .iMWrUY.button-link.is-primary, .jjFalE.button-link.is-primary
Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
86 44 0 14

On text
4.86:1 AA

On white
4.32:1 AA large

Background · .iMWrUY.button-link.is-primary, .jjFalE.button-link.is-primary
Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
52 0 3 75

On text
1.86:1 Fail

On white
11.28:1 AAA

Border, background · .fGva-dE::-webkit-scrollbar-thumb, --deep-400
Deep Teal

HEX

RGB

HSL

OKLCH

CMYK
32 0 3 56

On text
3.90:1 AA large

On white
5.38:1 AA

Border, background · .fGva-dE::-webkit-scrollbar-thumb, --deep-600
Deep Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
60 0 4 81

On text
1.49:1 Fail

On white
14.09:1 AAA

Background, text, border · .dHSJyS:hover >a, --deep-300
Cadet Blue

HEX

RGB

HSL

OKLCH

CMYK
23 0 3 44

On text
6.04:1 AA

On white
3.47:1 AA large

Background, text, border · .dHSJyS:hover >a, --deep-700
Light Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
41 0 2 67

On text
2.56:1 Fail

On white
8.20:1 AAA

Border · --deep-500, .iMWrUY.button-link.is-primary.is-outlined:disabled
Light Teal

HEX

RGB

HSL

OKLCH

CMYK
75 9 0 45

On text
4.49:1 AA large

On white
4.68:1 AA

Background, border · --foam-500, .dha-Dsk

Gradients

linear-gradient( light-dark(#104b55,#6fe0ed),light-dark(#104b55,#6fe0ed) )
radial-gradient( ellipse 100% 41.1% at 50% 0%, rgba(201,238,242,0.75) 0%, rgba(48,203,217,0.6) 10%, rgba(135,155,66,0.3) 50%, rgba(0,0,0,0) 100% )
radial-gradient( circle,rgba(201,238,242,0.75) 1px,transparent 1px )

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.

Plus Jakarta Sans

Aa 100 Aa 900

Inter

Self-hosted · weights 100, 400, 500, 600, 700, 900 · body · shown in a stand-in if you don’t have it

Aa 200 Aa 800

Plus Jakarta Sans

Self-hosted · weights 200, 600, 700, 800 · headings · shown in a stand-in if you don’t have it

Aa 100 Aa 800

JetBrains Mono

Self-hosted · weights 100, 800 · shown in a stand-in if you don’t have it

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

Type scale

From the site’s CSS

Heading 1 2em · 32 px Plus Jakarta Sans

AI-Native Cloud

Heading 2 — Plus Jakarta Sans

AI-Native Cloud | DigitalOcean

Heading 3 — Plus Jakarta Sans

AI-Native Cloud | DigitalOcean

Heading 4 — Plus Jakarta Sans

AI-Native Cloud | DigitalOcean

Heading 5 — Plus Jakarta Sans

AI-Native Cloud | DigitalOcean

Body — / 1.4 Inter

Run AI products in production with a unified stack for agents, inference, and cloud—built for control, performance, and economics at scale.

Small 80%

Run AI products in production with a unified stack for agents, inference, and cloud—built for control, performance, and economics at scale.

Button 100% / 1.15 none

Get started

Sizes in use

Most common across the site

32px1 rules
28pxline 36px · 4 rules
24pxline 32px · 2 rules
18pxline 26px · 3 rules
16pxline 24px · 22 rules
14pxline 20px · 5 rules
10pxline 0 · 2 rules

Elements

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

Elements

Corner radius

999px · 10×
16px · 8×
8px · 4×
100px · 2×
0 0 24px 24px · 2×
64px · 2×

Shadows

0 6px 20px -6px color-mix(in srgb,light-dark(#104b55,#6fe0ed) 15%,transparent)
8px 8px 12px 0 light-dark(rgba(0, 12, 42, 0.1), rgba(247, 248, 251, 0.1))
0 0 0 1px light-dark(#000a0a,#e5eceb)

Layout

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

Grid

Breakpoints

320

426

604

768

1024

1280

1440

On a scale of 0 to 1440 px.

Content widths (max-width)

1440 px

1360 px

720 px

640 px

464 px

320 px

Notes

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

Notes

● FineThe title is 30 characters, short enough to show in full in search results.
▲ CheckThere is no og:image, so links shared on social media show no picture.
▲ CheckBody text (#000000 on #000000) has a contrast of 1.00:1, under the 4.5:1 WCAG asks for.
▲ CheckThe favicon is dark on a see-through background, so it nearly disappears on dark browser tabs.

Questions

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

Questions

What font does AI-Native Cloud use?: AI-Native Cloud’s website uses three typefaces: Inter (body text), self-hosted; Plus Jakarta Sans (headings), self-hosted; JetBrains Mono, self-hosted.
What are AI-Native Cloud’s brand colours?: The main colours on digitalocean.com are Slate Grey (#104B55), Dark Turquoise (#6FE0ED), Dark Khaki (#94A54B), Olive Drab (#879B42), Dodger Blue (#2E85E0) and Steel Blue (#1E7ADB).
What colour is AI-Native Cloud’s text and background?: Body text is #000000 on a #000000 background.
Where is AI-Native Cloud’s logo from?: The logo shown in this guide was found on digitalocean.com’s homepage. For official logo files and usage rules, check AI-Native Cloud’s own brand or press page.
Is this AI-Native Cloud’s official style guide?: No. SiteStyleGuide made it from digitalocean.com’s public web pages on 2 November 2026, and isn’t affiliated with AI-Native Cloud. 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

digitalocean-com-tokens.css

Download

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

/* digitalocean.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/digitalocean.com) */
:root {
  /* Colours */
  --text: #000000;
  --background: #000000;
  --colour-off-white: #F4F5F5;
  --colour-black: #000000;
  --colour-cool-near-black: #000F0F;
  --colour-cool-light-grey: #C9D6D4;
  --colour-slate-grey: #104B55;
  --colour-dark-turquoise: #6FE0ED;
  --colour-dark-khaki: #94A54B;
  --colour-olive-drab: #879B42;
  --colour-dodger-blue: #2E85E0;
  --colour-steel-blue: #1E7ADB;
  --colour-slate-grey-2: #1F403E;
  --colour-deep-teal: #4D716E;
  --colour-deep-slate-grey: #13302E;
  --colour-cadet-blue: #6F908C;
  --colour-light-slate-grey: #325553;
  --colour-light-teal: #237F8C;
  --gradient-1: linear-gradient( light-dark(#104b55,#6fe0ed),light-dark(#104b55,#6fe0ed) );
  --gradient-2: radial-gradient( ellipse 100% 41.1% at 50% 0%, rgba(201,238,242,0.75) 0%, rgba(48,203,217,0.6) 10%, rgba(135,155,66,0.3) 50%, rgba(0,0,0,0) 100% );
  --gradient-3: radial-gradient( circle,rgba(201,238,242,0.75) 1px,transparent 1px );

  /* Typefaces */
  --font-body: 'Inter', 'Inter Fallback', sans-serif;
  --font-headings: 'Plus Jakarta Sans', sans-serif;
  --font-other: 'JetBrains Mono', 'JetBrains Mono Fallback', monospace;

  /* Type scale */
  --text-h1: 2em;
  --text-small: 80%;
  --text-button: 100%;
  --leading-button: 1.15;

  /* Shape */
  --radius-1: 999px;
  --radius-2: 16px;
  --radius-3: 8px;
  --radius-4: 100px;
  --radius-5: 0 0 24px 24px;
  --radius-6: 64px;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 320px;
  --breakpoint-2: 426px;
  --breakpoint-3: 604px;
  --breakpoint-4: 768px;
  --breakpoint-5: 1024px;
  --breakpoint-6: 1280px;
  --breakpoint-7: 1440px;
  --max-width-1: 1440px;
  --max-width-2: 1360px;
  --max-width-3: 720px;
  --max-width-4: 640px;
  --max-width-5: 464px;
  --max-width-6: 320px;
}

{
    "site": "digitalocean.com",
    "source": "https://sitestyleguide.com/digitalocean.com",
    "text": "#000000",
    "background": "#000000",
    "colours": [
        {
            "name": "Off White",
            "hex": "#F4F5F5",
            "rgb": [
                244,
                245,
                245
            ]
        },
        {
            "name": "Black",
            "hex": "#000000",
            "rgb": [
                0,
                0,
                0
            ]
        },
        {
            "name": "Cool Near Black",
            "hex": "#000F0F",
            "rgb": [
                0,
                15,
                15
            ]
        },
        {
            "name": "Cool Light Grey",
            "hex": "#C9D6D4",
            "rgb": [
                201,
                214,
                212
            ]
        },
        {
            "name": "Slate Grey",
            "hex": "#104B55",
            "rgb": [
                16,
                75,
                85
            ]
        },
        {
            "name": "Dark Turquoise",
            "hex": "#6FE0ED",
            "rgb": [
                111,
                224,
                237
            ]
        },
        {
            "name": "Dark Khaki",
            "hex": "#94A54B",
            "rgb": [
                148,
                165,
                75
            ]
        },
        {
            "name": "Olive Drab",
            "hex": "#879B42",
            "rgb": [
                135,
                155,
                66
            ]
        },
        {
            "name": "Dodger Blue",
            "hex": "#2E85E0",
            "rgb": [
                46,
                133,
                224
            ]
        },
        {
            "name": "Steel Blue",
            "hex": "#1E7ADB",
            "rgb": [
                30,
                122,
                219
            ]
        },
        {
            "name": "Slate Grey",
            "hex": "#1F403E",
            "rgb": [
                31,
                64,
                62
            ]
        },
        {
            "name": "Deep Teal",
            "hex": "#4D716E",
            "rgb": [
                77,
                113,
                110
            ]
        },
        {
            "name": "Deep Slate Grey",
            "hex": "#13302E",
            "rgb": [
                19,
                48,
                46
            ]
        },
        {
            "name": "Cadet Blue",
            "hex": "#6F908C",
            "rgb": [
                111,
                144,
                140
            ]
        },
        {
            "name": "Light Slate Grey",
            "hex": "#325553",
            "rgb": [
                50,
                85,
                83
            ]
        },
        {
            "name": "Light Teal",
            "hex": "#237F8C",
            "rgb": [
                35,
                127,
                140
            ]
        }
    ],
    "fonts": [
        {
            "name": "Inter",
            "stack": "'Inter', 'Inter Fallback', sans-serif",
            "weights": [
                100,
                400,
                500,
                600,
                700,
                900
            ],
            "source": "Self-hosted"
        },
        {
            "name": "Plus Jakarta Sans",
            "stack": "'Plus Jakarta Sans', sans-serif",
            "weights": [
                200,
                600,
                700,
                800
            ],
            "source": "Self-hosted"
        },
        {
            "name": "JetBrains Mono",
            "stack": "JetBrains Mono, JetBrains Mono Fallback, monospace",
            "weights": [
                100,
                800
            ],
            "source": "Self-hosted"
        }
    ]
}

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
sfgate.com

sfgate.com · set in Inter
Save

Websites whose lead colour is closest to AI-Native Cloud’s

National Archives

archives.gov · 6 days ago
Save
Blackboard

blackboard.com · 3 days ago
Save
Free Podcast Hosting

buzzsprout.com · 4 days ago
Save
k618.cn

k618.cn · 3 days ago
Save

Captured from digitalocean.com on 2 November 2026. SiteStyleGuide isn’t affiliated with or endorsed by AI-Native Cloud; this guide describes the public website for reference.

AI-Native Cloudstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

Off White

Black

Cool Near Black

Cool Light Grey

Colours

Slate Grey

Dark Turquoise

Dark Khaki

Olive Drab

Dodger Blue

Steel Blue

Slate Grey

Deep Teal

Deep Slate Grey

Cadet Blue

Light Slate Grey

Light Teal

Gradients

Plus Jakarta Sans

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run digitalocean.com?

Also set in Inter

ITFixio

IGN

Deezer

sfgate.com

Similar colours

National Archives

Blackboard

Free Podcast Hosting

k618.cn

Title &
description