frog, part of Capgemini Invent
frog.co · set in GT America
SaveUnofficial A style guide made by SiteStyleGuide from ziatile.com’s public web pages. Not affiliated with or endorsed by Zia Tile. The real site is ziatile.com ↗
Unofficial style guide
Zia Tilestyle guide
Zia Tile’s website (ziatile.com) uses GT America for its headings and body text. Its palette is led by Sienna (#C14427), Blue (#3E34D3) and Slate Grey (#807EA3), with #0D0E0B text on #FFFFFF. Captured from the live site on 2 November 2026.
- Website
- ziatile.com
- Typefaces
- GT America
- Palette
- 4 neutrals, 12 colours, 3 gradients
- Captured
- 2 Nov 2026 · added by @sitestyleguide
https://ziatile.com/
Screenshot
ziatile.com
Identity & metadata
What browsers, search engines and social cards show before anyone reaches the page, from the homepage’s <head>.
Title &
description
- Page title
- Zia Tile | Handmade Artisanal Tile and Stone from Around the World
- ▲ 66 / 60 characters
- Meta description
- The world’s finest handmade cement tiles and Moroccan zellige, plus Cotto, Ceramics, and Limestone. We ship worldwide from Los Angeles.
- ● 135 / 160 characters
- Site name
- Zia Tile
- og:title
- Zia Tile | Handmade Artisanal Tile and Stone from Around the World
- og:description
- The world’s finest handmade cement tiles and Moroccan zellige, plus Cotto, Ceramics, and Limestone. We ship worldwide from Los Angeles.
- Language
- en
In search results
Zia Tilehttps://ziatile.com/
Zia Tile | Handmade Artisanal Tile and Stone from Around the …
The world’s finest handmade cement tiles and Moroccan zellige, plus Cotto, Ceramics, and Limestone. We ship worldwide from Los Angeles.
When shared
ziatile.com
Zia Tile | Handmade Artisanal Tile and Stone from Around the World
The world’s finest handmade cement tiles and Moroccan zellige, plus Cotto, Ceramics, and Limestone. We ship w…
Logo & favicons
Found as: SVG in the header. SVG, 146 × 27.
Logo
On white
On black
On Sienna
Favicons
1 found-
32 px · PNG
icon
Zia Tile | Handmade Artisanal Tile and Stone from Around the World
Light browser tab
Zia Tile | Handmade Artisanal Tile and Stone from Around the World
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 (#0D0E0B) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.
Colour
Balance
How much each colour is used- Deep Black 44.4%
- White 33.3%
- Off White 6.5%
- Sienna 5.5%
- Light Black 4.7%
- Blue 1.4%
- Slate Grey 0.8%
- Midnight Blue 0.7%
- Red 0.7%
- Steel Blue 0.6%
- Medium Sea Green 0.3%
- Burly Wood 0.2%
- Honey Dew 0.2%
- Misty Rose 0.2%
- Corn Silk 0.2%
- Orange 0.2%
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-
Deep Black
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 7 0 21 95
- On text
- —
- On white
- 19.36:1 AAA
Text, background, border · swym-storefront-layout-as-drawer #swym-storefront-layout-container .swym-storefr, .button--primary
-
White
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 0 0 0
- On text
- 19.36:1 AAA
- On white
- —
Background, text, graphic · button.swym-variant-selector, body
-
Off White
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 0 0 6
- On text
- 16.84:1 AAA
- On white
- 1.15:1 Fail
Background, border, graphic · swym-storefront-layout-as-drawer .swym-storefront-layout-loader .swym-storefront, [data-page-template=product] .header.border:not(.active):not(.is-open)
-
Light Black
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 0 0 89
- On text
- 1.14:1 Fail
- On white
- 17.04:1 AAA
Text, border · .swym-storefront-layout-title, .swym-storefront-layout-empty-wishlist-title
Colours
Brand colours and accents, most used first-
Sienna
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 65 80 24
- On text
- 3.80:1 AA large
- On white
- 5.09:1 AA
Text, background, border · .project-detail-room__heading.error::after, .password .password-hero__heading
-
Blue
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 71 75 0 17
- On text
- 2.43:1 Fail
- On white
- 7.96:1 AAA
Text, background, border · .aa-SourceHeaderTitle, .aa-PanelHeader
-
Slate Grey
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 21 23 0 36
- On text
- 5.01:1 AA
- On white
- 3.87:1 AA large
Text · .aa-ItemContentSubtitleCategory, .algolia-horizon-theme [role=dialog][open]:has(.aa-Autocomplete)>#search-modal-h
-
Midnight Blue
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 67 43 0 79
- On text
- 1.18:1 Fail
- On white
- 16.47:1 AAA
Text, background · swym-storefront-layout-notification[status="info"], .swym-storefront-layout-header
-
Red
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 99 99 8
- On text
- 4.16:1 AA large
- On white
- 4.66:1 AA
Text · .swym-storefront-layout-action-btn.remove-from-list-button, .swym-storefront-layout-action-btn.delete-list-button
-
Steel Blue
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 100 52 0 0
- On text
- 4.82:1 AA
- On white
- 4.02:1 AA large
Background, text, border · --swiper-theme-color, .swiper-pagination-bullet-active
-
Medium Sea Green
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 75 0 40 29
- On text
- 7.24:1 AAA
- On white
- 2.67:1 Fail
Text, background · .trade-form__status-banner, .trade-form__status-message
-
Burly Wood
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 23 46 17
- On text
- 8.56:1 AAA
- On white
- 2.26:1 Fail
Background · ::-moz-selection, ::selection
-
Honey Dew
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 11 0 8 7
- On text
- 15.60:1 AAA
- On white
- 1.24:1 Fail
Background · swym-storefront-layout-notification[status="success"], --swym-storefront-layout-notification-success-bg-color
-
Misty Rose
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 13 12 3
- On text
- 14.50:1 AAA
- On white
- 1.34:1 Fail
Background · swym-storefront-layout-notification[status="error"], --swym-storefront-layout-notification-error-bg-color
-
Corn Silk
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 5 20 0
- On text
- 17.47:1 AAA
- On white
- 1.11:1 Fail
Background · swym-storefront-layout-notification[status="warning"], --swym-storefront-layout-notification-warning-bg-color
-
Orange
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 37 86 4
- On text
- 8.78:1 AAA
- On white
- 2.20:1 Fail
Background · .collection__filter .plp-colors .plp-filter__checkbox[data-color=orange], --adp-day-name-color
Gradients
-
linear-gradient(90deg, #e8e8e8 25%, #f5f5f5 50%, #e8e8e8 75%)
-
linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))
-
linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))
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.
GT America
Aa
400
Aa
900
GT America
Self-hosted · weights 400, 500, 600, 900 · headings, buttons · 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
24px / 1.25
weight 900 · none · GT America
Zia Tile
Heading 2
28px / 1.15
weight 900 · none · GT America
Zia Tile | Handmade Artisanal Tile and Stone fr…
Heading 3
24px / 1.15
weight 900 · none · GT America
Zia Tile | Handmade Artisanal Tile and Stone fr…
Heading 4
22px / 1.15
weight 900 · none · GT America
Zia Tile | Handmade Artisanal Tile and Stone fr…
Heading 5
20px / 1.15
weight 900 · none · GT America
Zia Tile | Handmade Artisanal Tile and Stone fr…
Heading 6
18px / 1.15
weight 900 · none · GT America
Zia Tile | Handmade Artisanal Tile and Stone fr…
Paragraph
12px / normal
weight 600 · GT America
The world’s finest handmade cement tiles and Moroccan zellige, plus Cotto, Ceramics, and Limestone. We ship worldwide from Los Angeles.
Button
14px
weight 600 · capitalize · GT America
Get started
Link
12px / normal
weight 600 · GT America
Read more about Zia Tile
Sizes in use
Most common across the site- 24pxline 1.25 · 11 rules
- 20pxline 1.5 · 13 rules
- 18pxline 1.25 · 11 rules
- 16pxline 1.56 · 10 rules
- 14pxline 1 · 61 rules
- 13pxline 18px · 27 rules
- 12pxline 16px · 38 rules
- 9pxline 1.25 · 8 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
.lightbox-instagram .tagged-products button.tagged-buy-button · #FFFFFF
Corner radius
- 10px · 20×
- 50% · 16×
- 3px · 10×
- 4px · 10×
- 19px · 9×
Shadows
- 0 2px 2px -1px #eaeaea
- unset
- 0 5px 10px rgba(0, 0, 0, 0.3)
- 0 0 0 1px rgba(35,38,59,.1),0 6px 16px -4px rgba(35,38,59,.15)
Layout
Breakpoints from the site’s media queries and the widths its content is held to, with how often each appears.
Grid
Breakpoints
480
640
767
768
1023
1024
1280
1440
On a scale of 0 to 1440 px.
Content widths (max-width)
1920 px
1360 px
705 px
550 px
441 px
410 px
Notes
Plain checks on what was found. Worth fixing if you look after this site.
Notes
- ▲ CheckThe title is 66 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.
Questions
Quick answers, from the same capture as the rest of this guide.
Questions
- What font does Zia Tile use?
- Zia Tile’s website uses one typeface: GT America (headings and body text), self-hosted.
- What are Zia Tile’s brand colours?
- The main colours on ziatile.com are Sienna (#C14427), Blue (#3E34D3), Slate Grey (#807EA3), Midnight Blue (#121F36), Red (#EA0202) and Steel Blue (#007AFF).
- What colour is Zia Tile’s text and background?
- Body text is #0D0E0B on a #FFFFFF background.
- Where is Zia Tile’s logo from?
- The logo shown in this guide was found on ziatile.com’s homepage. For official logo files and usage rules, check Zia Tile’s own brand or press page.
- Is this Zia Tile’s official style guide?
- No. SiteStyleGuide made it from ziatile.com’s public web pages on 2 November 2026, and isn’t affiliated with Zia Tile. 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
ziatile-com-tokens.css
/* ziatile.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/ziatile.com) */
:root {
/* Colours */
--text: #0D0E0B;
--background: #FFFFFF;
--colour-deep-black: #0D0E0B;
--colour-white: #FFFFFF;
--colour-off-white: #EFEFEF;
--colour-light-black: #1C1C1C;
--colour-sienna: #C14427;
--colour-blue: #3E34D3;
--colour-slate-grey: #807EA3;
--colour-midnight-blue: #121F36;
--colour-red: #EA0202;
--colour-steel-blue: #007AFF;
--colour-medium-sea-green: #2DB46C;
--colour-burly-wood: #D4A373;
--colour-honey-dew: #D4EDDA;
--colour-misty-rose: #F8D7DA;
--colour-corn-silk: #FFF3CD;
--colour-orange: #F59A23;
--gradient-1: linear-gradient(90deg, #e8e8e8 25%, #f5f5f5 50%, #e8e8e8 75%);
--gradient-2: linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0));
--gradient-3: linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0));
/* Typefaces */
--font-headings: 'GT America', sans-serif;
--font-buttons: 'GT America', sans-serif;
/* Type scale */
--text-h1: 24px;
--leading-h1: 1.25;
--text-h2: 28px;
--leading-h2: 1.15;
--text-h3: 24px;
--leading-h3: 1.15;
--text-h4: 22px;
--leading-h4: 1.15;
--text-h5: 20px;
--leading-h5: 1.15;
--text-h6: 18px;
--leading-h6: 1.15;
--text-p: 12px;
--leading-p: normal;
--text-button: 14px;
--text-a: 12px;
--leading-a: normal;
/* Shape */
--radius-1: 10px;
--radius-2: 50%;
--radius-3: 3px;
--radius-4: 4px;
--radius-5: 19px;
/* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
--breakpoint-1: 480px;
--breakpoint-2: 640px;
--breakpoint-3: 767px;
--breakpoint-4: 768px;
--breakpoint-5: 1023px;
--breakpoint-6: 1024px;
--breakpoint-7: 1280px;
--breakpoint-8: 1440px;
--max-width-1: 1920px;
--max-width-2: 1360px;
--max-width-3: 705px;
--max-width-4: 550px;
--max-width-5: 441px;
--max-width-6: 410px;
}
{
"site": "ziatile.com",
"source": "https://sitestyleguide.com/ziatile.com",
"text": "#0D0E0B",
"background": "#FFFFFF",
"colours": [
{
"name": "Deep Black",
"hex": "#0D0E0B",
"rgb": [
13,
14,
11
]
},
{
"name": "White",
"hex": "#FFFFFF",
"rgb": [
255,
255,
255
]
},
{
"name": "Off White",
"hex": "#EFEFEF",
"rgb": [
239,
239,
239
]
},
{
"name": "Light Black",
"hex": "#1C1C1C",
"rgb": [
28,
28,
28
]
},
{
"name": "Sienna",
"hex": "#C14427",
"rgb": [
193,
68,
39
]
},
{
"name": "Blue",
"hex": "#3E34D3",
"rgb": [
62,
52,
211
]
},
{
"name": "Slate Grey",
"hex": "#807EA3",
"rgb": [
128,
126,
163
]
},
{
"name": "Midnight Blue",
"hex": "#121F36",
"rgb": [
18,
31,
54
]
},
{
"name": "Red",
"hex": "#EA0202",
"rgb": [
234,
2,
2
]
},
{
"name": "Steel Blue",
"hex": "#007AFF",
"rgb": [
0,
122,
255
]
},
{
"name": "Medium Sea Green",
"hex": "#2DB46C",
"rgb": [
45,
180,
108
]
},
{
"name": "Burly Wood",
"hex": "#D4A373",
"rgb": [
212,
163,
115
]
},
{
"name": "Honey Dew",
"hex": "#D4EDDA",
"rgb": [
212,
237,
218
]
},
{
"name": "Misty Rose",
"hex": "#F8D7DA",
"rgb": [
248,
215,
218
]
},
{
"name": "Corn Silk",
"hex": "#FFF3CD",
"rgb": [
255,
243,
205
]
},
{
"name": "Orange",
"hex": "#F59A23",
"rgb": [
245,
154,
35
]
}
],
"fonts": [
{
"name": "GT America",
"stack": "\"GT America\", sans-serif",
"weights": [
400,
500,
600,
900
],
"source": "Self-hosted"
}
]
}
Share
Links open each service’s own share page. Nothing from them loads here.
Share
Run ziatile.com?
Add the badge to your siteLink 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/ziatile.com" title="Zia Tile style guide on SiteStyleGuide"><img src="https://sitestyleguide.com/public/badge.svg" alt="View our style guide on SiteStyleGuide" width="200" height="44"></a>
Also set in GT America
Other websites using GT America as their main typeface
Betterment
betterment.com · set in GT America
Save
Emergence Magazine
emergencemagazine.org · set in GT America
Save
Harvard Business Review
hbr.org · set in GT America
Save
Similar colours
Websites whose lead colour is closest to Zia Tile’s
Vogue
vogue.com · 3 hours ago
Save
feedburner.com
feedburner.com · 3 days ago
Save
Amazon.in
amazon.in · 4 days ago
Save
GSMArena.com
gsmarena.com · 3 days ago
Save
Captured from ziatile.com on 2 November 2026. SiteStyleGuide isn’t affiliated with or endorsed by Zia Tile; this guide describes the public website for reference.