What font does Atolls use?

Atolls’s website uses two typefaces: Inter (headings and body text), self-hosted; New Spirit, self-hosted.

What are Atolls’s brand colours?

The main colours on coupons.com are Deep Royal Blue (#006CE8), Midnight Blue (#21294A), Teal (#0B8381), Light Pink (#FF1A7D), Deep Pink (#FA006E) and Lavender (#D6DEFF).

What colour is Atolls’s text and background?

Body text is #4D4D4D on a #F2F2F2 background.

Where is Atolls’s logo from?

The logo shown in this guide was found on coupons.com’s homepage. For official logo files and usage rules, check Atolls’s own brand or press page.

Is this Atolls’s official style guide?

No. SiteStyleGuide made it from coupons.com’s public web pages on 21 October 2026, and isn’t affiliated with Atolls. Members can refresh a guide after 90 days to pick up changes.

Unofficial A style guide made by SiteStyleGuide from coupons.com’s public web pages. Not affiliated with or endorsed by Atolls. The real site is coupons.com ↗

Unofficial style guide

Atollsstyle guide

Atolls’s website (coupons.com) uses Inter for its headings and body text. Its palette is led by Deep Royal Blue (#006CE8), Midnight Blue (#21294A) and Teal (#0B8381), with #4D4D4D text on #F2F2F2. Captured from the live site on 21 October 2026.

Website: coupons.com
Typefaces: Inter, New Spirit
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 21 Oct 2026 · added by @sitestyleguide

Save Add to collection Share Report

Screenshot of the coupons.com homepage on a desktop screen — Screenshot of coupons.com on a 1440 px desktop screen, 21 Oct 2026.

Screenshot of the coupons.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: Coupons, Promo Codes and Cashback for October 2026; ● 50 / 60 characters
Meta description: Use Coupons.com for the best coupons and promo codes online and in-store. Save on every order with our verified coupon codes, grocery coupons, and cashback offers.; ▲ 163 / 160 characters
Site name: Atolls
og:title: Coupons, Promo Codes and Cashback for October 2026
og:description: Use Coupons.com for the best coupons and promo codes online and in-store. Save on every order with our verified coupon codes, grocery coupons, and cashback offers.
Language: en-US

In search results

Atollshttps://www.coupons.com/

Coupons, Promo Codes and Cashback for October 2026

Use Coupons.com for the best coupons and promo codes online and in-store. Save on every order with our verified coupon codes, grocery coupons, and cashback offer…

When shared

coupons.com

Coupons, Promo Codes and Cashback for October 2026

Use Coupons.com for the best coupons and promo codes online and in-store. Save on every order with our verifi…

Logo & favicons

Found as: SVG in the header. SVG.

Logo

On white

On black

On Deep Royal Blue

Favicons

1 found

16 px · PNG icon

Coupons, Promo Codes and Cashback for October 2026

Light browser tab

Coupons, Promo Codes and Cashback for October 2026

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 (#4D4D4D) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

White 32.5%
Near Black 21%
Deep Royal Blue 7.7%
Off White 6.6%
Midnight Blue 6.1%
Dark Grey 5.8%
Teal 2.9%
Light Pink 2.4%
Deep Pink 2.3%
Lavender 2.1%
Light Royal Blue 2.1%
Orange 2.1%
Deep Black 2%
Red 1.7%
Light Black 1.4%
Pink 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

White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 0

On text
8.45:1 AAA

On white
—

Background, text, border · --background-color, --border-color
Near Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 95

On text
2.30:1 Fail

On white
19.44:1 AAA

Text, border · --label-color, --icon-color
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 10

On text
6.77:1 AA

On white
1.25:1 Fail

Background, border · --icon-disable-color, --indicator-background-color
Dark Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 70

On text
—

On white
8.45:1 AAA

Text, border · body, .ka7il50.textColor .see-all

Colours

Brand colours and accents, most used first

Deep Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
100 53 0 9

On text
1.74:1 Fail

On white
4.87:1 AA

Text, background, border · .qn0s73c, .qn0s73i
Midnight Blue

HEX

RGB

HSL

OKLCH

CMYK
55 45 0 71

On text
1.68:1 Fail

On white
14.18:1 AAA

Background, text · --idle-border-color, --button-primary-medium-label
Teal

HEX

RGB

HSL

OKLCH

CMYK
92 0 2 49

On text
1.84:1 Fail

On white
4.59:1 AA

Text, background, border · .qn0s73e, .wn1kj73
Light Pink

HEX

RGB

HSL

OKLCH

CMYK
0 90 51 0

On text
2.29:1 Fail

On white
3.69:1 AA large

Used · --idle-border-color, --hover-border-color
Deep Pink

HEX

RGB

HSL

OKLCH

CMYK
0 100 56 2

On text
2.13:1 Fail

On white
3.97:1 AA large

Text, border · --focus-shadow-color, --focus-border-color
Lavender

HEX

RGB

HSL

OKLCH

CMYK
16 13 0 0

On text
6.34:1 AA

On white
1.33:1 Fail

Background, border · --background-color, ._1eja8c91
Light Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
49 38 0 27

On text
1.87:1 Fail

On white
4.53:1 AA

Used · --focus-shadow-color, --boxShadow-focus-color
Orange

HEX

RGB

HSL

OKLCH

CMYK
0 37 100 0

On text
4.14:1 AA large

On white
2.04:1 Fail

Background, text, border · .qn0s737, .upqfc78
Deep Black

HEX

RGB

HSL

OKLCH

CMYK
58 44 0 86

On text
2.17:1 Fail

On white
18.33:1 AAA

Used · --focus-shadow-color, --focus-border-color
Red

HEX

RGB

HSL

OKLCH

CMYK
0 100 100 14

On text
1.61:1 Fail

On white
5.23:1 AA

Text, border, background · .drepm47.error, .ma1of26.error
Light Black

HEX

RGB

HSL

OKLCH

CMYK
0 36 62 76

On text
1.66:1 Fail

On white
13.99:1 AAA

Used · --palette-brand-primary-onPaleLargeText, --palette-brand-secondary-onMildLargeText
Pink

HEX

RGB

HSL

OKLCH

CMYK
0 29 16 0

On text
5.17:1 AA

On white
1.64:1 Fail

Background · ._4mjicp5, .znpha77:before

Gradients

linear-gradient(to right, #fff0, 20%, #FFFFFF)
linear-gradient(to right, #FFFFFF, 80%, #fff0)
linear-gradient(0deg, rgba(26, 26, 26, 0.04), rgba(26, 26, 26, 0.04))

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 400 Aa 700

Inter

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

Aa 500 Aa 700

New Spirit

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

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

Type scale

From the site’s CSS

Body / weight

Use Coupons.com for the best coupons and promo codes online and in-store. Save on every order with our verified coupon codes, grocery coupo…

Paragraph 14px / 20px weight 400 · Inter

Use Coupons.com for the best coupons and promo codes online and in-store. Save on every order with our verified coupon codes, grocery coupo…

Sizes in use

Most common across the site

24pxline 32px · 6 rules
22pxline 28px · 4 rules
20pxline 28px · 5 rules
18pxline 24px · 8 rules
16pxline 24px · 23 rules
14pxline 20px · 39 rules
12pxline 16px · 39 rules
10pxline 14px · 4 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

4px · 28×
16px · 19×
8px · 17×
50% · 14×
24px · 9×

Shadows

0px 0px 0px
0 0 0
0px 7px 11px 5px hsl(0 0% 0% / 0.0314),0px 5px 5px 0px hsl(0 0% 0% / 0.0784)

Layout

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

Grid

Breakpoints

647

648

768

1024

1199

1200

On a scale of 0 to 1440 px.

Content widths (max-width)

1500 px

1200 px

482 px

420 px

350 px

320 px

Notes

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

Notes

● FineThe title is 50 characters, short enough to show in full in search results.
▲ CheckThe description is 163 characters. Search results usually show about 160.

Questions

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

Questions

What font does Atolls use?: Atolls’s website uses two typefaces: Inter (headings and body text), self-hosted; New Spirit, self-hosted.
What are Atolls’s brand colours?: The main colours on coupons.com are Deep Royal Blue (#006CE8), Midnight Blue (#21294A), Teal (#0B8381), Light Pink (#FF1A7D), Deep Pink (#FA006E) and Lavender (#D6DEFF).
What colour is Atolls’s text and background?: Body text is #4D4D4D on a #F2F2F2 background.
Where is Atolls’s logo from?: The logo shown in this guide was found on coupons.com’s homepage. For official logo files and usage rules, check Atolls’s own brand or press page.
Is this Atolls’s official style guide?: No. SiteStyleGuide made it from coupons.com’s public web pages on 21 October 2026, and isn’t affiliated with Atolls. 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

coupons-com-tokens.css

Download

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

/* coupons.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/coupons.com) */
:root {
  /* Colours */
  --text: #4D4D4D;
  --background: #F2F2F2;
  --colour-white: #FFFFFF;
  --colour-near-black: #0D0D0D;
  --colour-off-white: #E6E6E6;
  --colour-dark-grey: #4D4D4D;
  --colour-deep-royal-blue: #006CE8;
  --colour-midnight-blue: #21294A;
  --colour-teal: #0B8381;
  --colour-light-pink: #FF1A7D;
  --colour-deep-pink: #FA006E;
  --colour-lavender: #D6DEFF;
  --colour-light-royal-blue: #5E73BA;
  --colour-orange: #FFA000;
  --colour-deep-black: #0F1424;
  --colour-red: #DB0000;
  --colour-light-black: #3D2717;
  --colour-pink: #FFB5D6;
  --gradient-1: linear-gradient(to right, #fff0, 20%, #FFFFFF);
  --gradient-2: linear-gradient(to right, #FFFFFF, 80%, #fff0);
  --gradient-3: linear-gradient(0deg, rgba(26, 26, 26, 0.04), rgba(26, 26, 26, 0.04));

  /* Typefaces */
  --font-headings: 'Inter', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  --font-buttons: 'Inter', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;

  /* Type scale */
  --text-p: 14px;
  --leading-p: 20px;

  /* Shape */
  --radius-1: 4px;
  --radius-2: 16px;
  --radius-3: 8px;
  --radius-4: 50%;
  --radius-5: 24px;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 647px;
  --breakpoint-2: 648px;
  --breakpoint-3: 768px;
  --breakpoint-4: 1024px;
  --breakpoint-5: 1199px;
  --breakpoint-6: 1200px;
  --max-width-1: 1500px;
  --max-width-2: 1200px;
  --max-width-3: 482px;
  --max-width-4: 420px;
  --max-width-5: 350px;
  --max-width-6: 320px;
}

{
    "site": "coupons.com",
    "source": "https://sitestyleguide.com/coupons.com",
    "text": "#4D4D4D",
    "background": "#F2F2F2",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Near Black",
            "hex": "#0D0D0D",
            "rgb": [
                13,
                13,
                13
            ]
        },
        {
            "name": "Off White",
            "hex": "#E6E6E6",
            "rgb": [
                230,
                230,
                230
            ]
        },
        {
            "name": "Dark Grey",
            "hex": "#4D4D4D",
            "rgb": [
                77,
                77,
                77
            ]
        },
        {
            "name": "Deep Royal Blue",
            "hex": "#006CE8",
            "rgb": [
                0,
                108,
                232
            ]
        },
        {
            "name": "Midnight Blue",
            "hex": "#21294A",
            "rgb": [
                33,
                41,
                74
            ]
        },
        {
            "name": "Teal",
            "hex": "#0B8381",
            "rgb": [
                11,
                131,
                129
            ]
        },
        {
            "name": "Light Pink",
            "hex": "#FF1A7D",
            "rgb": [
                255,
                26,
                125
            ]
        },
        {
            "name": "Deep Pink",
            "hex": "#FA006E",
            "rgb": [
                250,
                0,
                110
            ]
        },
        {
            "name": "Lavender",
            "hex": "#D6DEFF",
            "rgb": [
                214,
                222,
                255
            ]
        },
        {
            "name": "Light Royal Blue",
            "hex": "#5E73BA",
            "rgb": [
                94,
                115,
                186
            ]
        },
        {
            "name": "Orange",
            "hex": "#FFA000",
            "rgb": [
                255,
                160,
                0
            ]
        },
        {
            "name": "Deep Black",
            "hex": "#0F1424",
            "rgb": [
                15,
                20,
                36
            ]
        },
        {
            "name": "Red",
            "hex": "#DB0000",
            "rgb": [
                219,
                0,
                0
            ]
        },
        {
            "name": "Light Black",
            "hex": "#3D2717",
            "rgb": [
                61,
                39,
                23
            ]
        },
        {
            "name": "Pink",
            "hex": "#FFB5D6",
            "rgb": [
                255,
                181,
                214
            ]
        }
    ],
    "fonts": [
        {
            "name": "Inter",
            "stack": "Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif",
            "weights": [
                400,
                500,
                600,
                700
            ],
            "source": "Self-hosted"
        },
        {
            "name": "New Spirit",
            "stack": "'New Spirit', Georgia, 'Times New Roman', serif",
            "weights": [
                500,
                600,
                700
            ],
            "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
AI-Native Cloud

digitalocean.com · set in Inter
Save

Websites whose lead colour is closest to Atolls’s

ASUS Global

asus.com · 5 days ago
Save
Electronic Arts Home Page

ea.com · 2 days ago
Save
Apple

apple.co · 18 hours ago
Save
agoda.com

agoda.com · 18 hours ago
Save

Captured from coupons.com on 21 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Atolls; this guide describes the public website for reference.

Atollsstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Near Black

Off White

Dark Grey

Colours

Deep Royal Blue

Midnight Blue

Teal

Light Pink

Deep Pink

Lavender

Light Royal Blue

Orange

Deep Black

Red

Light Black

Pink

Gradients

Inter

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run coupons.com?

Also set in Inter

ITFixio

IGN

Deezer

AI-Native Cloud

Similar colours

ASUS Global

Electronic Arts Home Page

Apple

agoda.com

Title &
description