What font does Tasting Table use?

Tasting Table’s website uses three typefaces: tablet-gothic-wide-semibold (headings), self-hosted; abril-titling-semibold, self-hosted; abril-text-regular (body text), self-hosted.

What are Tasting Table’s brand colours?

The main colours on tastingtable.com are Golden Rod (#EEB045), Wheat (#EEDBBC), Yellow (#FFFF00), Near Black (#0F0F0F), White (#FFFFFF) and Off White (#EBEBEB).

What colour is Tasting Table’s text and background?

Body text is #0F0F0F on a #F7F7F7 background.

Where is Tasting Table’s logo from?

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

Is this Tasting Table’s official style guide?

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

Tasting Table Style Guide: Colours, Fonts & Logo

Identity & metadata

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

Title &
description

Page title: Tasting Table | Food, Restaurants, Reviews, Recipes, Cooking Tips; ▲ 65 / 60 characters
Meta description: Breaking food industry news, cooking tips, recipes, reviews, rankings, and interviews - since 2008.; ● 99 / 160 characters
Site name: Tasting Table
og:title: Tasting Table | Food, Restaurants, Reviews, Recipes, Cooking Tips
og:description: Breaking food industry news, cooking tips, recipes, reviews, rankings, and interviews - since 2008.
Language: en-US

In search results

Tasting Tablehttps://www.tastingtable.com/

Tasting Table | Food, Restaurants, Reviews, Recipes, Cooking …

Breaking food industry news, cooking tips, recipes, reviews, rankings, and interviews - since 2008.

When shared

The image Tasting Table shares with links

tastingtable.com

Tasting Table | Food, Restaurants, Reviews, Recipes, Cooking Tips

Breaking food industry news, cooking tips, recipes, reviews, rankings, and interviews - since 2008.

Back to top ↑

Logo & favicons

Found as: schema.org logo. PNG, 1280 × 720.

Logo

On white

On black

On Golden Rod

Favicons

1 found

448 px · PNG shortcut icon

Tasting Table | Food, Restaurants, Reviews, Recipes, Cooking Tips

Light browser tab

Tasting Table | Food, Restaurants, Reviews, Recipes, Cooking Tips

Dark browser tab

Back to top ↑

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

Colour

Balance

How much each colour is used

Near Black 27.2%
Golden Rod 23.7%
White 23.6%
Off White 12.7%
Light Grey 9.6%
Wheat 2.3%
Yellow 0.9%

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

Near Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 94

On text
—

On white
19.17:1 AAA

Text, background · body, a.button button
White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 0

On text
19.17:1 AAA

On white
—

Background, text, graphic · body, header
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 8

On text
16.08:1 AAA

On white
1.19:1 Fail

Text, background, graphic · .nav-opener.close:after, #footer-link-container span a
Light Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 19

On text
12.18:1 AAA

On white
1.57:1 Fail

Text, background, border · h1.page-header:after, #footer-detail-container

Colours

Brand colours and accents, most used first

Golden Rod

HEX

RGB

HSL

OKLCH

CMYK
0 26 71 7

On text
9.98:1 AAA

On white
1.92:1 Fail

Background, text, graphic · .article-item h1 a, p a
Wheat

HEX

RGB

HSL

OKLCH

CMYK
0 8 21 7

On text
14.14:1 AAA

On white
1.36:1 Fail

Background · .article-item h1 a:hover, --active-gradient-light
Yellow

HEX

RGB

HSL

OKLCH

CMYK
0 0 100 0

On text
17.85:1 AAA

On white
1.07:1 Fail

Background · mark

Gradients

radial-gradient(rgba(228,228,228,.3) 1.5px,transparent 0)
linear-gradient(180deg,#EEB045 0%,#EEB045 100%)
radial-gradient(#CECECE 1.5px,transparent 0)

Back to top ↑

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.

tablet-gothic-wide-semibold

Aa 100 Aa 600

tablet-gothic-wide-semibold

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

Aa 600

abril-titling-semibold

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

Aa 400

abril-text-regular

Self-hosted · weights 400 · body · shown in a stand-in if you don’t have it

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

Type scale

From the site’s CSS · root 10 px

Heading 1 3.2rem · 32 px / 135% weight 600 · abril-titling-semibold

Tasting Table

Heading 2 2.6rem · 26 px / 135% weight 600 · abril-titling-semibold

Tasting Table | Food, Restaurants, Reviews, Rec…

Heading 3 2.2rem · 22 px / 135% weight 600 · abril-titling-semibold

Tasting Table | Food, Restaurants, Reviews, Rec…

Heading 4 1.9rem · 19 px / 135% weight 600 · abril-titling-semibold

Tasting Table | Food, Restaurants, Reviews, Rec…

Body 10px / 100% abril-text-regular

Breaking food industry news, cooking tips, recipes, reviews, rankings, and interviews - since 2008.

Paragraph 1.8rem · 18 px / 1.6

Breaking food industry news, cooking tips, recipes, reviews, rankings, and interviews - since 2008.

Small 1.6rem · 16 px

Breaking food industry news, cooking tips, recipes, reviews, rankings, and interviews - since 2008.

Button 1.2rem · 12 px uppercase

Get started

Link 0.8rem · 8 px / 100% uppercase · tablet-gothic-wide-semibold

Sizes in use

Most common across the site

32pxline 135% · 1 rules
26pxline 135% · 2 rules
18pxline 1.6 · 3 rules
16pxline 140% · 8 rules
15pxline 150% · 3 rules
14pxline 130% · 6 rules
13px2 rules
10pxline 100% · 1 rules

Back to top ↑

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

a.button button · #0F0F0F

Shadows

1px 1px 0 rgba(0,0,0,0.05)

Back to top ↑

Layout

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

Grid

Breakpoints

750

768

926

992

On a scale of 0 to 1440 px.

Content widths (max-width)

1400 px

1194 px

Back to top ↑

Notes

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

Notes

▲ CheckThe title is 65 characters. Google usually cuts titles near 60, so the end may not show in results.
▲ CheckThe favicon is dark on a see-through background, so it nearly disappears on dark browser tabs.

Back to top ↑

Questions

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

Questions

What font does Tasting Table use?: Tasting Table’s website uses three typefaces: tablet-gothic-wide-semibold (headings), self-hosted; abril-titling-semibold, self-hosted; abril-text-regular (body text), self-hosted.
What are Tasting Table’s brand colours?: The main colours on tastingtable.com are Golden Rod (#EEB045), Wheat (#EEDBBC), Yellow (#FFFF00), Near Black (#0F0F0F), White (#FFFFFF) and Off White (#EBEBEB).
What colour is Tasting Table’s text and background?: Body text is #0F0F0F on a #F7F7F7 background.
Where is Tasting Table’s logo from?: The logo shown in this guide was found on tastingtable.com’s homepage. For official logo files and usage rules, check Tasting Table’s own brand or press page.
Is this Tasting Table’s official style guide?: No. SiteStyleGuide made it from tastingtable.com’s public web pages on 30 October 2026, and isn’t affiliated with Tasting Table. Members can refresh a guide after 90 days to pick up changes.

Back to top ↑

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

tastingtable-com-tokens.css

Download

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

/* tastingtable.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/tastingtable.com) */
:root {
  /* Colours */
  --text: #0F0F0F;
  --background: #F7F7F7;
  --colour-near-black: #0F0F0F;
  --colour-white: #FFFFFF;
  --colour-off-white: #EBEBEB;
  --colour-light-grey: #CECECE;
  --colour-golden-rod: #EEB045;
  --colour-wheat: #EEDBBC;
  --colour-yellow: #FFFF00;
  --gradient-1: radial-gradient(rgba(228,228,228,.3) 1.5px,transparent 0);
  --gradient-2: linear-gradient(180deg,#EEB045 0%,#EEB045 100%);
  --gradient-3: radial-gradient(#CECECE 1.5px,transparent 0);

  /* Typefaces */
  --font-headings: 'tablet-gothic-wide-semibold', 'tablet-gothic-fallback', sans-serif;
  --font-body: 'abril-text-regular', 'abril-text-fallback', sans-serif;

  /* Type scale */
  --text-h1: 3.2rem;
  --leading-h1: 135%;
  --text-h2: 2.6rem;
  --leading-h2: 135%;
  --text-h3: 2.2rem;
  --leading-h3: 135%;
  --text-h4: 1.9rem;
  --leading-h4: 135%;
  --text-body: 10px;
  --leading-body: 100%;
  --text-p: 1.8rem;
  --leading-p: 1.6;
  --text-small: 1.6rem;
  --text-button: 1.2rem;
  --text-a: 0.8rem;
  --leading-a: 100%;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 750px;
  --breakpoint-2: 768px;
  --breakpoint-3: 926px;
  --breakpoint-4: 992px;
  --max-width-1: 1400px;
  --max-width-2: 1194px;
}

{
    "site": "tastingtable.com",
    "source": "https://sitestyleguide.com/tastingtable.com",
    "text": "#0F0F0F",
    "background": "#F7F7F7",
    "colours": [
        {
            "name": "Near Black",
            "hex": "#0F0F0F",
            "rgb": [
                15,
                15,
                15
            ]
        },
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Off White",
            "hex": "#EBEBEB",
            "rgb": [
                235,
                235,
                235
            ]
        },
        {
            "name": "Light Grey",
            "hex": "#CECECE",
            "rgb": [
                206,
                206,
                206
            ]
        },
        {
            "name": "Golden Rod",
            "hex": "#EEB045",
            "rgb": [
                238,
                176,
                69
            ]
        },
        {
            "name": "Wheat",
            "hex": "#EEDBBC",
            "rgb": [
                238,
                219,
                188
            ]
        },
        {
            "name": "Yellow",
            "hex": "#FFFF00",
            "rgb": [
                255,
                255,
                0
            ]
        }
    ],
    "fonts": [
        {
            "name": "tablet-gothic-wide-semibold",
            "stack": "tablet-gothic-wide-semibold, tablet-gothic-fallback, sans-serif",
            "weights": [
                100,
                600
            ],
            "source": "Self-hosted"
        },
        {
            "name": "abril-titling-semibold",
            "stack": "abril-titling-semibold, abril-titling-fallback, serif",
            "weights": [
                600
            ],
            "source": "Self-hosted"
        },
        {
            "name": "abril-text-regular",
            "stack": "abril-text-regular, abril-text-fallback, sans-serif",
            "weights": [
                400
            ],
            "source": "Self-hosted"
        }
    ]
}

Back to top ↑

Share

Links open each service’s own share page. Nothing from them loads here.

Share

X LinkedIn Facebook Pinterest Reddit Email

Run tastingtable.com?

Add the badge to your site

Link to this guide from your own site, so your team, designers and agencies can find your colours and fonts in one place.

<a href="https://sitestyleguide.com/tastingtable.com" title="Tasting Table style guide on SiteStyleGuide"><img src="https://sitestyleguide.com/public/badge.svg" alt="View our style guide on SiteStyleGuide" width="200" height="44"></a>

Back to top ↑

Tasting Tablestyle guide

Title &
description

Logo

Favicons

Colour

Balance

Neutrals

Near Black

White

Off White

Light Grey

Colours

Golden Rod

Wheat

Yellow

Gradients

tablet-gothic-wide-semibold

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Miraheze

Tamino Design

mixi

ViV MGMT

Tasting Tablestyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

Near Black

White

Off White

Light Grey

Colours

Golden Rod

Wheat

Yellow

Gradients

tablet-gothic-wide-semibold

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run tastingtable.com?

Similar colours

Miraheze

Tamino Design

mixi

ViV MGMT

Title &
description