Brand Guidelines · v1.1
RandomFact

Building simple apps to solve interesting problems.

01

The big idea.

Random Fact is curiosity made tidy. Every brand decision should reinforce two qualities at once.

Playful

Bubbles, warm color, conversational copy, a wink in the wordmark.

Considered

Geometric construction, restrained typography, generous whitespace.

If a design feels noisy, it is wrong. If it feels sterile, it is wrong.The mark is bubbles, not foam.

02

The mark.

A cluster of overlapping circles paired with the Random Fact wordmark. Each size shows a different amount of detail — not just a different scale.

2.1Anatomy: the bubble system

The mark is built from three layers, each containing a complementary color pair and circles drawn at three discrete radii.

Background

soft, distant

Middle

the brand colors you remember

Foreground

weight, anchor

Assembled

All three layers, drawn back-to-front.

Small
r = 4.96
Medium
r = 6.87
Large
r = 11.07

Three radii, in roughly a 1 : 1.38 : 2.23 progression. No intermediate sizes.

2.2Logo lockups

Icon — minimal
Favicon, app icon, anywhere ≤ 24px. Four bubbles, one per layer plus an anchor.
bubbles-little.svg
Icon — medium
Mobile header, compact spaces — anywhere the minimal feels too sparse and the full mark would be too big. Eight bubbles, two per layer.
bubbles-medium.svg
Icon — full
Splash screens, marketing hero art, large decorative use. Eighteen bubbles, all three layers.
bubbles-big.svg
RandomFact
Tag (icon + wordmark)
Tablet/desktop header, marketing, footers. The default lockup when space allows.
tag-medium.svg

2.3Clear space

Reserve clear space equal to the diameter of one large bubble on all sides. Nothing — text, edge, button, another logo — may enter that zone.

↘ 2r
2r ↖

2.4Minimum sizes

Icon — minimal
16 px digital · 8 mm print
Icon — medium
32 px digital · 14 mm print
Icon — full
128 px digital · 56 mm print
RandomFact
Tag
120 px wide · 32 mm print

Below these sizes, drop to the next-smaller lockup rather than shrinking further. The full icon is sized for hero and splash use — for headers and other compact placements, reach for the medium.

2.5Backgrounds

Warm off-white
The default surface. Mark as drawn.
True black
Foreground navy will recede. That's correct.
03

Color.

Two colors carry the brand. Six colors build it. Always pair within a layer.

3.1The signature pair

Brand Blue
Random
#3f7ca5
rgb(63, 124, 165)
Primary headings, "Random" wordmark, dark-mode buttons.
Brand Gold
Fact
#f7b600
rgb(247, 182, 0)
"Fact" wordmark, light-mode buttons, accents.

3.2The full palette — three layered pairs

Background

Atmosphere — soft tints, hover and disabled states, illustration backdrops.

Cream
Soft warm tint, disabled-button background
#fce9a8rgb(252, 233, 168)
Sky
Soft cool tint, atmospheric accents
#c0e5f9rgb(192, 229, 249)
Middle

Signature — the brand colors you remember.

Gold
Signature warm
#f7b600rgb(247, 182, 0)
Blue
Signature cool
#3f7ca5rgb(63, 124, 165)
Foreground

Anchor — depth and weight, dense text and small high-contrast accents.

Bronze
Warm anchor, deep accent
#915e00rgb(145, 94, 0)
Navy
Cool anchor, dark-mode disabled
#071f39rgb(7, 31, 57)

3.3Surfaces & text

Light theme
Primary text
Secondary text — for captions, hints, and inactive labels.
bg #faf9f7
border #e5e7eb
text/1 #1f2937
text/2 #6b7280
Dark theme
Primary text
Secondary text — for captions, hints, and inactive labels.
bg #000000
border #334155
text/1 #f1f5f9
text/2 #94a3b8

The light background is intentionally warm, not pure white — it lets the gold sit comfortably without vibration. Do not substitute #ffffff.

3.4Accessibility

ForegroundBackgroundSampleRatioVerdict
#1f2937#faf9f7
Aa
≥ 12 : 1AAA body
#3f7ca5#faf9f7
Aa
≥ 4.5 : 1AA body, AAA large
#915e00#faf9f7
Aa
≥ 4.5 : 1AA body
#071f39#fce9a8
Aa
≥ 12 : 1AAA body
#f1f5f9#000000
Aa
≥ 18 : 1AAA body
#f7b600#ffffff
Aa
~ 2.1 : 1Fails — display only
04

Typography.

Two typefaces, used strictly for two purposes. Exo speaks. Montserrat reads.

4.1Exo — display

Aa
Exo
Geometric, slightly futuristic, confident. The wordmark, all headings, feature numbers, short callouts. Never body.
Regular Semibold Bold
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 & ! ? — •

The quick brown fox jumps over the lazy dog.

4.2Montserrat — body

Aa
Montserrat
Warm, even, quietly modern. Paragraphs, lists, navigation, buttons, forms, captions — everything that is not display.
Regular Medium Semibold
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 & ! ? — •

A new fact, every visit. The product is the canonical brand expression — its rhythm and restraint are part of how Random Fact reads.

4.3Type scale

Hero (h1, home)
text-7xl
Random Fact
Page title (h1)
text-6xl
About
Section (h2)
text-2xl
What we make
Lead paragraph
text-2xl
Building simple apps to solve interesting problems.
Body
text-base
The product is the canonical brand expression. Cross-reference page.tsx for the home page composition.
Caption / nav
text-sm
About · Contact · Privacy

4.4The wordmark, in type

RandomFact
familyExoweightBold (700)tracking0caseSentence
Random#3f7ca5Fact#f7b600

Stacked or inline are both acceptable. Never uppercase, italic, or underlined.

05

Voice & tone.

A person who finds the world interesting and assumes you do too. Not the loudest one in the room — the one who makes the loudest one laugh.

We are
  • Curious, not academic.
  • Warm, not cute.
  • Brief, not blunt.
  • Honest about what the apps do, and what they don't.
We are not
  • Hype-y. ("Revolutionary," "10x" — none of these.)
  • Cynical. We don't punch down.
  • Performatively quirky.
  • Reaching for emoji to do the work of words.
✗ off-brand

"Mind-blowing facts delivered straight to your screen!"

✓ on-brand

"A new fact, every visit."

✗ off-brand

"We're a passionate team building cutting-edge mobile experiences."

✓ on-brand

"Building simple apps to solve interesting problems."

✗ off-brand

"Don't miss out — sign up now!"

✓ on-brand

"Want updates? Drop us a note."

06

In the wild.

The product is the canonical brand expression. Everything else takes its cues from how the home page is set.

6.1Home — the canonical expression

randomfact.com
RandomFact
Random Fact

Octopuses have three hearts, nine brains, and blue blood — all things the rest of us are visibly out-classed by.

6.2Store badges

Get it on
App Store
Get it on
Mac App Store
Get it on
Google Play
Get it on
Microsoft Store

Use the version that contrasts with the surface — black on light, white on dark. Never on Brand Gold or Brand Blue. Separate from the Random Fact mark by clear space ≥ the badge height.

6.3A button, a button, a button

Primary — light
Primary — dark
Disabled
07

Misuse, at a glance.

None of these are okay. They appear here so you can recognize them when you see them — and not ship them.

Random Fact
Wordmark colors swapped
Random Fact
Wordmark in Montserrat
RANDOM FACT
Wordmark in caps
Bubbles recolored
Mark in a rounded frame
Drop shadow on the mark
Mark rotated
Pure white background
RandomFact

Brand Guidelines v1.1 — last revised 2026-05-03.
Companion to the markdown source in /docs/brand_guidelines.md.

Files
Mark — minimalbubbles-little.svg
Mark — mediumbubbles-medium.svg
Mark — fullbubbles-big.svg
Tag (icon + wordmark)tag-medium.svg
Faviconfavicon.svg
Theme tokensthemes.css
Type setuplayout.tsx
Source — markdownbrand_guidelines.md