sfgate.com
sfgate.com · 2 days ago
SaveUnofficial A style guide made by SiteStyleGuide from scale.com’s public web pages. Not affiliated with or endorsed by Scale. The real site is scale.com ↗
Unofficial style guide
Scalestyle guide
Scale’s website (scale.com) uses aeonik for its headings and body text. Its palette is led by Royal Blue (#006ADC), Dodger Blue (#0091FF) and Deep Black (#1E1E2C), with #FFFFFF text on #000000. Captured from the live site on 22 October 2026.
- Website
- scale.com
- Typefaces
- aeonik, Inter, Arial
- Palette
- 4 neutrals, 12 colours, 3 gradients
- Captured
- 22 Oct 2026 · added by @sitestyleguide
https://scale.com/
Screenshot
scale.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
- Scale: Reliable AI Systems for Critical Decisions
- ● 49 / 60 characters
- Meta description
- Scale delivers proven data, evaluations, and outcomes to AI labs, governments, and the Fortune 500.
- ● 99 / 160 characters
- Site name
- Scale
- og:title
- Scale: Reliable AI Systems for Critical Decisions
- og:description
- Scale delivers proven data, evaluations, and outcomes to AI labs, governments, and the Fortune 500.
- Language
- en
- Theme colour
- #000000
In search results
Scalehttps://scale.com/
Scale: Reliable AI Systems for Critical Decisions
Scale delivers proven data, evaluations, and outcomes to AI labs, governments, and the Fortune 500.
When shared
scale.com
Scale: Reliable AI Systems for Critical Decisions
Scale delivers proven data, evaluations, and outcomes to AI labs, governments, and the Fortune 500.
Logo & favicons
Found as: schema.org logo. PNG, 1200 × 469.
Logo
On white
On black
On Royal Blue
Favicons
5 found-
384 px · PNG
manifest
-
192 px · PNG
manifest
-
180 px · PNG
apple-touch-icon
-
48 px · ICO icon
-
32 px · SVG
icon
Scale: Reliable AI Systems for Critical Decisions
Light browser tab
Scale: Reliable AI Systems for Critical Decisions
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 (#FFFFFF) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.
Colour
Balance
How much each colour is used- White 33.7%
- Black 15.6%
- Near Black 11.1%
- Off White 9.9%
- Royal Blue 4%
- Dodger Blue 3.8%
- Deep Black 2.6%
- Light Black 2.6%
- Sea Green 2.6%
- Dark Golden Rod 2.6%
- Fire Brick 2.6%
- Deep Plum 2%
- Tan 2%
- Cornflower Blue 1.8%
- Light Sky Blue 1.8%
- Light Plum 1.6%
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
- —
- On white
- —
Background, text, border · .form-content-module-scss-module__1N8NtW__form__wrapper__light form.hs-form div., .form-content-module-scss-module__1N8NtW__form__wrapper__modal form.hs-form div.
-
Black
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 0 0 100
- On text
- 21.00:1 AAA
- On white
- 21.00:1 AAA
Background, text, border · html, .national-security-module__lBBaeq__page .SgpFlywheel .intro-wrapper h4.AnimatedT
-
Near Black
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 0 11 89
- On text
- 17.26:1 AAA
- On white
- 17.26:1 AAA
Text, background, border · .form-content-module-scss-module__1N8NtW__form__wrapper__light form.hs-form div., .Button__root__oZxHz
-
Off White
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 0 0 7
- On text
- 1.17:1 Fail
- On white
- 1.17:1 Fail
Background, text, border · .Button__rootcolor_softSand__oZxHz7UNe, .Button__rootcolor_softSand__h9Zbcf3P1W
Colours
Brand colours and accents, most used first-
Royal Blue
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 100 52 0 14
- On text
- 5.13:1 AA
- On white
- 5.13:1 AA
Text, background · .Button__slotTargetStartIconcolor_softBlue__kfg6FujvzI, .Button__slotTargetChildrencolor_softBlue__oefHRujvzI
-
Dodger Blue
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 100 43 0 0
- On text
- 3.23:1 AA large
- On white
- 3.23:1 AA large
Text, background · .Button__rootcolor_blue__oZxHz2PMPi, .Button__rootcolor_blue__h9ZbcvYdjp
-
Deep Black
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 32 32 0 83
- On text
- 16.44:1 AAA
- On white
- 16.44:1 AAA
Background · .form-content-module-scss-module__1N8NtW__form__wrapper form.hs-form input:-webk, .form-content-module-scss-module__1N8NtW__form__wrapper form.hs-form textarea:-w
-
Light Black
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 23 72 79
- On text
- 14.23:1 AAA
- On white
- 14.23:1 AAA
Text · .Button__slotTargetStartIconcolor_yellow__kfg6FlVgNi, .Button__slotTargetChildrencolor_yellow__oefHrlVgNi
-
Sea Green
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 80 0 36 53
- On text
- 5.41:1 AA
- On white
- 5.41:1 AA
Text · .Button__slotTargetStartIconcolor_softGreen__kfg6FFjo2, .Button__slotTargetChildrencolor_softGreen__oefHrFjo2
-
Dark Golden Rod
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 30 100 42
- On text
- 4.95:1 AA
- On white
- 4.95:1 AA
Text · .Button__slotTargetStartIconcolor_softYellow__kfg6FzzB8V, .Button__slotTargetChildrencolor_softYellow__oefHRzzB8V
-
Fire Brick
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 75 90 21
- On text
- 5.28:1 AA
- On white
- 5.28:1 AA
Text · .Button__slotTargetStartIconcolor_softRed__kfg6FyJycL, .Button__slotTargetChildrencolor_softRed__oefHryJycL
-
Deep Plum
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 31 2 22
- On text
- 2.64:1 Fail
- On white
- 2.64:1 Fail
Background, text · .audio-module-scss-module__A3Y_tG__progress-bar, .bg-scale-mauve
-
Tan
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 0 13 26 34
- On text
- 2.97:1 Fail
- On white
- 2.97:1 Fail
Text, background · inline style on <h2>, inline style on <span>
-
Cornflower Blue
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 44 35 0 13
- On text
- 3.08:1 AA large
- On white
- 3.08:1 AA large
Background, text · .audio-module-scss-module__A3Y_tG__progress-bar, .bg-scale-periwinkle
-
Light Sky Blue
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 45 21 0 5
- On text
- 1.95:1 Fail
- On white
- 1.95:1 Fail
Background, border, text · .audio-module-scss-module__A3Y_tG__progress-bar, .text-gradient
-
Light Plum
- HEX
- RGB
- HSL
- OKLCH
- CMYK
- 3 21 0 16
- On text
- 2.01:1 Fail
- On white
- 2.01:1 Fail
Background, text · .text-gradient, .bg-gradient-x
Gradients
-
linear-gradient(90.13deg,#d1aad7 .11%,#c88bc4 25.06%,#7b8fdd 50%,#86bff2 74.8%,#bbdef2 99.76%)
-
linear-gradient(initial)
-
linear-gradient(257.92deg,#fff0 -15.06%,#ffffff60 56.1%,#fff6 80.48%)
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.
aeonik
Aa
400
Aa
600
aeonik
Self-hosted · weights 400, 600 · body, headings · shown in a stand-in if you don’t have it
Aa
400
Aa
600
Inter
System font, or not loaded on this page · weights 400, 500, 600 · buttons · shown in a stand-in if you don’t have it
Aa
400
Arial
System font, or not loaded on this page · weights 400 · shown in a stand-in if you don’t have it
Aa
400
Aa
500
New Forest
Self-hosted · weights 400, 500 · shown in a stand-in if you don’t have it
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 ! ? & @ % $ – ’ “ ”
Type scale
From the site’s CSS
Heading 1
—
weight 400 · aeonik
Scale
Heading 2
2rem · 32 px / 1.08
weight 400 · aeonik
Scale: Reliable AI Systems for Critical Decisio…
Heading 3
—
weight 400 · aeonik
Scale: Reliable AI Systems for Critical Decisio…
Heading 4
—
weight 400 · aeonik
Scale: Reliable AI Systems for Critical Decisio…
Heading 5
—
weight 400 · aeonik
Scale: Reliable AI Systems for Critical Decisio…
Heading 6
—
weight 400 · aeonik
Scale: Reliable AI Systems for Critical Decisio…
Paragraph
1.125rem · 18 px / 1
weight 400 · aeonik
Scale delivers proven data, evaluations, and outcomes to AI labs, governments, and the Fortune 500.
Small
80%
Scale delivers proven data, evaluations, and outcomes to AI labs, governments, and the Fortune 500.
Sizes in use
Most common across the site- 32pxline 1.5 · 8 rules
- 24pxline 1.33333 · 18 rules
- 20pxline 1.6 · 13 rules
- 18pxline initial · 8 rules
- 16pxline 1.5 · 22 rules
- 14pxline 1.375 · 85 rules
- 13pxline 1.8 · 10 rules
- 12pxline 1.2 · 7 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
#onetrust-consent-sdk #onetrust-banner-sdk.otFlat button#onetrust-accept-btn-han · #FFFFFF · radius .5rem
Corner radius
- 16px · 22×
- .5rem · 22×
- 8px · 13×
- 24px · 13×
- .375rem · 12×
- inherit · 9×
Shadows
- 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 0 #0000
- 0 0 0 3px #17171714
- 0 0 0 3px #96c7f2
- 0 0 #0000, 0 0 #0000, 0 0 #0000
Layout
Breakpoints from the site’s media queries and the widths its content is held to, with how often each appears.
Grid
Breakpoints
390
640
767
768
991
1024
1280
1450
On a scale of 0 to 1450 px.
Content widths (max-width)
1042 px
1010 px
870 px
840 px
730 px
720 px
Notes
Plain checks on what was found. Worth fixing if you look after this site.
Notes
- ● FineThe title is 49 characters, short enough to show in full in search 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 Scale use?
- Scale’s website uses two typefaces: aeonik (headings and body text), self-hosted; New Forest, self-hosted.
- What are Scale’s brand colours?
- The main colours on scale.com are Royal Blue (#006ADC), Dodger Blue (#0091FF), Deep Black (#1E1E2C), Light Black (#35290F), Sea Green (#18794E) and Dark Golden Rod (#946800).
- What colour is Scale’s text and background?
- Body text is #FFFFFF on a #000000 background.
- Where is Scale’s logo from?
- The logo shown in this guide was found on scale.com’s homepage. For official logo files and usage rules, check Scale’s own brand or press page.
- Is this Scale’s official style guide?
- No. SiteStyleGuide made it from scale.com’s public web pages on 22 October 2026, and isn’t affiliated with Scale. 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
scale-com-tokens.css
/* scale.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/scale.com) */
:root {
/* Colours */
--text: #FFFFFF;
--background: #000000;
--colour-white: #FFFFFF;
--colour-black: #000000;
--colour-near-black: #1B1B18;
--colour-off-white: #EDEDEC;
--colour-royal-blue: #006ADC;
--colour-dodger-blue: #0091FF;
--colour-deep-black: #1E1E2C;
--colour-light-black: #35290F;
--colour-sea-green: #18794E;
--colour-dark-golden-rod: #946800;
--colour-fire-brick: #CA3214;
--colour-deep-plum: #C88BC4;
--colour-tan: #A8927C;
--colour-cornflower-blue: #7B8FDD;
--colour-light-sky-blue: #86BFF2;
--colour-light-plum: #D1AAD7;
--gradient-1: linear-gradient(90.13deg,#d1aad7 .11%,#c88bc4 25.06%,#7b8fdd 50%,#86bff2 74.8%,#bbdef2 99.76%);
--gradient-2: linear-gradient(initial);
--gradient-3: linear-gradient(257.92deg,#fff0 -15.06%,#ffffff60 56.1%,#fff6 80.48%);
/* Typefaces */
--font-body: 'aeonik', 'aeonik Fallback', -apple-system, 'Arial', sans-serif;
--font-headings: 'aeonik', 'aeonik Fallback', -apple-system, 'Arial', sans-serif;
--font-buttons: 'Inter', sans-serif;
--font-other: -apple-system, 'Arial', sans-serif;
/* Type scale */
--text-h2: 2rem;
--leading-h2: 1.08;
--text-p: 1.125rem;
--leading-p: 1;
--text-small: 80%;
/* Shape */
--radius-1: 16px;
--radius-2: .5rem;
--radius-3: 8px;
--radius-4: 24px;
--radius-5: .375rem;
--radius-6: inherit;
/* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
--breakpoint-1: 390px;
--breakpoint-2: 640px;
--breakpoint-3: 767px;
--breakpoint-4: 768px;
--breakpoint-5: 991px;
--breakpoint-6: 1024px;
--breakpoint-7: 1280px;
--breakpoint-8: 1450px;
--max-width-1: 1042px;
--max-width-2: 1010px;
--max-width-3: 870px;
--max-width-4: 840px;
--max-width-5: 730px;
--max-width-6: 720px;
}
{
"site": "scale.com",
"source": "https://sitestyleguide.com/scale.com",
"text": "#FFFFFF",
"background": "#000000",
"colours": [
{
"name": "White",
"hex": "#FFFFFF",
"rgb": [
255,
255,
255
]
},
{
"name": "Black",
"hex": "#000000",
"rgb": [
0,
0,
0
]
},
{
"name": "Near Black",
"hex": "#1B1B18",
"rgb": [
27,
27,
24
]
},
{
"name": "Off White",
"hex": "#EDEDEC",
"rgb": [
237,
237,
236
]
},
{
"name": "Royal Blue",
"hex": "#006ADC",
"rgb": [
0,
106,
220
]
},
{
"name": "Dodger Blue",
"hex": "#0091FF",
"rgb": [
0,
145,
255
]
},
{
"name": "Deep Black",
"hex": "#1E1E2C",
"rgb": [
30,
30,
44
]
},
{
"name": "Light Black",
"hex": "#35290F",
"rgb": [
53,
41,
15
]
},
{
"name": "Sea Green",
"hex": "#18794E",
"rgb": [
24,
121,
78
]
},
{
"name": "Dark Golden Rod",
"hex": "#946800",
"rgb": [
148,
104,
0
]
},
{
"name": "Fire Brick",
"hex": "#CA3214",
"rgb": [
202,
50,
20
]
},
{
"name": "Deep Plum",
"hex": "#C88BC4",
"rgb": [
200,
139,
196
]
},
{
"name": "Tan",
"hex": "#A8927C",
"rgb": [
168,
146,
124
]
},
{
"name": "Cornflower Blue",
"hex": "#7B8FDD",
"rgb": [
123,
143,
221
]
},
{
"name": "Light Sky Blue",
"hex": "#86BFF2",
"rgb": [
134,
191,
242
]
},
{
"name": "Light Plum",
"hex": "#D1AAD7",
"rgb": [
209,
170,
215
]
}
],
"fonts": [
{
"name": "aeonik",
"stack": "'aeonik', 'aeonik Fallback', -apple-system, Arial, sans-serif",
"weights": [
400,
600
],
"source": "Self-hosted"
},
{
"name": "Inter",
"stack": "Inter, sans-serif",
"weights": [
400,
500,
600
],
"source": "System font, or not loaded on this page"
},
{
"name": "Arial",
"stack": ", -apple-system, Arial, sans-serif",
"weights": [
400
],
"source": "System font, or not loaded on this page"
},
{
"name": "New Forest",
"stack": "New Forest, -apple-system, Arial, sans-serif",
"weights": [
400,
500
],
"source": "Self-hosted"
},
{
"name": "mono",
"stack": "mono, mono Fallback",
"weights": [
400
],
"source": "Self-hosted"
},
{
"name": "Aeonik NatSec Medium",
"stack": "\"Aeonik NatSec Medium\", 'aeonik', 'aeonik Fallback', sans-serif",
"weights": [
500
],
"source": "Self-hosted"
}
]
}
Share
Links open each service’s own share page. Nothing from them loads here.
Share
Run scale.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/scale.com" title="Scale style guide on SiteStyleGuide"><img src="https://sitestyleguide.com/public/badge.svg" alt="View our style guide on SiteStyleGuide" width="200" height="44"></a>
Similar colours
Websites whose lead colour is closest to Scale’s
slideshare.net
slideshare.net · 4 days ago
Save
ASUS Global
asus.com · 5 days ago
Save
American Civil Liberties Union
aclu.org · 5 days ago
Save
Captured from scale.com on 22 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Scale; this guide describes the public website for reference.