# Reddit: brand book and build spec

A conversation-led identity: OrangeRed, dimensional Snoo, warm readable type and a modular Conversation Bubble connect the corporate brand with a wide variety of communities.

From unfairly.ai/brand-guidelines/reddit, checked 2026-10-31. Unofficial study; not affiliated with Reddit.

Every value is labelled with where it came from: **published** (the brand says it), **observed** (measured or seen on its live site, with the date), **our reading** (inferred from the evidence) or **our recipe** (how we apply the system). Files beside this one: tokens.css, tokens.json (DTCG 2025.10), kit.json.

**Thesis (our reading):** Make conversation the shape of the brand. Based on: The same bubble lives in the icon, wordmark counters, display lettering, framing, layout units and spring-like motion. Color separates Reddit speaking from communities speaking.

## Purpose

Mission: Help communities flourish and make what they know available to all. (published; https://redditbrand.lingoapp.com/s/Overview-orqY1E — Mission)

| Value | What it means in the work | Source |
|---|---|---|
| Inherently eclectic | Welcome different backgrounds, interests and opinions. | published: https://redditbrand.lingoapp.com/s/Brand-values-o4n1r2 — Inherently eclectic |
| Confidently ourselves | Protect what makes Reddit and its communities distinctive. | published: https://redditbrand.lingoapp.com/s/Brand-values-o4n1r2 — Confidently ourselves |
| Delightfully absurd | Make room for appropriate weirdness, humor and fun. | published: https://redditbrand.lingoapp.com/s/Brand-values-o4n1r2 — Delightfully absurd |
| Genuinely candid | Stay relatable through honesty, vulnerability and sincerity. | published: https://redditbrand.lingoapp.com/s/Brand-values-o4n1r2 — Genuinely candid |

## Fixed and flexible

Never changes:
- Conversation Bubble geometry
- OrangeRed as the evergreen brand signal
- Approved logo artwork
- Accessible left-aligned text
- Candid and helpful writing

The one thing that varies: Secondary tonal families for community voices; bubble widths/heights, content density, Snoo expressions, user imagery and context-appropriate humor.

## Positioning

- **Statement**: Where we discover and participate through real conversation (published)
- **Category**: A community platform organized around people, conversations and interests. (published)
- **Audience**: People exploring shared interests, communities, and business audiences engaging with those communities. (our reading)
- **Problem**: People need a welcoming place to ask questions, explore interests and find common ground. (our reading)
- **Promise**: Discover knowledge and participate through real conversation. (published)
- **Differentiators**: Community interests and genuine discussion anchor the experience.; A broad mix of people and perspectives can feel at home.; Distinctive candor and playful absurdity give the platform its own cultural character.
- **Alternatives**: Other social platforms are the comparison class; the guide does not name competitors.

## Messaging

Boilerplate (published): Reddit helps people build communities around their interests, exchange knowledge and take part in genuine discussion. Its identity reflects the varied people and conversations that make those communities possible.

Taglines:
- Reddit is the heart of the internet (Published brand description; not explicitly labeled a tagline)

| Pillar | Claim | Proof | Label |
|---|---|---|---|
| People and belonging | Welcome varied perspectives and help people feel at home. | Custom Snoos reflect community backgrounds, interests and personal identities.; Reddit Sans uses disambiguated characters and supports more than 100 languages. | our reading |
| Real conversation | Make space for candid discussion and useful exchange. | The strategic foundation centers tools for community building and genuine discussion. | our reading |
| Interests and discovery | Turn shared interests into communities and accessible knowledge. | Photography prioritizes actual user contributions and named communities.; The strategic foundation centers tools for community building and genuine discussion. | our reading |

They never claim:
- Maintain honesty and useful context rather than opaque explanations.
- Do not imply that a personal custom Snoo is an official Reddit account or endorsement.

Real lines, as they wrote them:
| Line | Channel | Source |
|---|---|---|
| "Come for the content. Stay for the comments." | Consumer audience | https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Sample messaging by audience |
| "The real joke is in the comments." | Consumer audience | https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Sample messaging by audience |
| "Make your brand the topic of conversation." | Business audience | https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Sample messaging by audience |

## Voice

Tone words: Inviting and helpful, Original and authentic, Clever and playful, Honest and familiar.

Traits:
- Inherently eclectic, but not Exclusionary or uniform (our reading)
- Confidently ourselves, but not Generic corporate imitation (our reading)
- Delightfully absurd, but not Random or insensitive (our reading)
- Genuinely candid, but not Opaque or affected (our reading)

- Consumer communication emphasizes candid conversation; business communication adapts conversation to commercial needs.
- Audience sample messaging is available in native images even where viewport captures show loading failures; short exact examples are recorded in study.headlines.

Rules a copy check enforces:
- Use brief everyday phrasing that helps the reader quickly; avoid formality and technical language that would sound unnatural aloud.
- Assume good intent and frame guidance positively; avoid hostile or transactional language.
- Keep playful language away from sensitive posts, comments and communities.
- Use humor and meta references only when they add useful context rather than confusion.
- Create contextual moments of delight; silly vocabulary or punctuation alone does not achieve it.
- Explain directly and transparently in simple language.
- Plan a structure; write descriptive headings, short paragraphs and scannable lists.
- Keep paragraphs within 6 desktop lines or 100 words; preferably within 5 lines or 70 words.
- Read sentences aloud and rewrite difficult phrasing; use one consistent style.
- Avoid corporate jargon and clichés; bring a distinctive Reddit perspective.

Their words: redditors, communities.
Never: corporate-speak, clichés, confusing meta humor, playful language beside sensitive content.

## Color

| Name | Hex | Role | Use |
|---|---|---|---|
| OrangeRed | #FF4500 | Primary; evergreen brand voice; always visible in primary compositions | Primary; evergreen brand voice; always visible in primary compositions |
| Dark | #000000 | Primary; black text and dark grounds | Primary; black text and dark grounds |
| Light | #FFFFFF | Primary; white grounds and reversed type | Primary; white grounds and reversed type |
| GuavaPink | #FF5FC2 | Secondary; community identity and content, rather than evergreen corporate voice | Secondary; community identity and content, rather than evergreen corporate voice |
| BananaYellow | #FFBF0B | Secondary; community identity and content, rather than evergreen corporate voice | Secondary; community identity and content, rather than evergreen corporate voice |
| LimeGreen | #AEEF0F | Secondary; community identity and content, rather than evergreen corporate voice | Secondary; community identity and content, rather than evergreen corporate voice |
| JuniperBlue | #00E2B7 | Secondary; community identity and content, rather than evergreen corporate voice | Secondary; community identity and content, rather than evergreen corporate voice |
| OrangeRed Highlight | #FF8864 | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white |
| GuavaPink Highlight | #FF9FDF | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white |
| BananaYellow Highlight | #FFDE55 | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white |
| LimeGreen Highlight | #E4FF45 | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white |
| JuniperBlue Highlight | #92FFEA | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive highlight; separate content blocks within a tonal family; not low-contrast shapes on white |
| OrangeRed Tint | #FFDAD7 | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white |
| GuavaPink Tint | #FFE6F9 | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white |
| BananaYellow Tint | #FFF3C0 | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white |
| LimeGreen Tint | #F0FFB3 | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white |
| JuniperBlue Tint | #E6FFFA | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white | Supportive tint; separate content blocks within a tonal family; not low-contrast shapes on white |
| OrangeRed Shade (In-Product Text) | #D82400 | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration |
| GuavaPink Shade (In-Product Text) | #D3168B | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration |
| BananaYellow Shade (In-Product Text) | #F27300 | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration |
| LimeGreen Shade (In-Product Text) | #65B200 | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration |
| JuniperBlue Shade (In-Product Text) | #08A59D | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration | Tertiary; in-product text, status and illustration depth; not high-visibility marketing grounds, frames or accents except within illustration |
| Errigal White | #F6F9FB | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth |
| Frost | #E7EEF4 | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth |
| Salt | #DBE4E9 | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth |
| Porpoise | #748791 | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth |
| Slate | #48545B | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth |
| Charcoal | #21272A | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth | Neutral; product and website hierarchy, legibility, light/dark modes and illustration depth |

## Typography

| Role | Their face | Licence | Open stand-in (Google Fonts) | Fallback |
|---|---|---|---|---|
| display | Reddit Display | Proprietary; not publicly supplied | Reddit Sans | "Reddit Sans", sans-serif |
| body | Reddit Sans | SIL Open Font License 1.1 | Reddit Sans | sans-serif |
| mono | Reddit Mono | SIL Open Font License 1.1 | Reddit Mono | monospace |

| Role | Token | Face | Desktop | Phone | Line height | Tracking | Weight |
|---|---|---|---|---|---|---|---|
| Hero H1 | --text-hero-* | Reddit Sans | 70px | 48px | 1 | 0px | 800 |
| Explainer and feature H2 | --text-heading-* | Reddit Sans | 40px | 28px | 1.25 | 0px | 800 |
| Stats and news H2 | --text-section-* | Reddit Sans | 48px | 32px | 1.041667 | 0px | 800 |
| Statistic | --text-stat-* | Reddit Sans | 48px | 32px | 1.041667 | 0px | 800 |
| Body | --text-body-* | Reddit Sans | 20px | 16px | 1.44 | 0px | 400 |
| News card title | --text-card-* | Reddit Sans | 20px | 16px | 1.44 | 0px | 700 |
| Navigation | --text-nav-* | Reddit Sans | 16px | 16px | 1.44 | 0px | 600 |
| Footer heading | --text-footer-* | Reddit Sans | 24px | 24px | 1.44 | 0px | 700 |
| Footer link | --text-footer-link-* | Reddit Sans | 16px | 16px | 1.44 | 0px | 400 |
| Copyright | --text-legal-* | Reddit Sans | 12px | 12px | 1.44 | 0px | 400 |

## Layout

Measured on https://redditinc.com/: headless Chromium at1440px and390px; computed styles plus supplied screenshots.

| Measure | Desktop (1440) | Phone (390) |
|---|---|---|
| Page margin | 234px | 20px |
| Section padding | 100px | 48px |
| Container max width | 972px | full |
| Hero text width | max 474px | full |
| Grid columns | 2 | 1 |
| Gutter | 24px | 0px |
| Card gap | 32px | 32px |

Breakpoints from Reddit's CSS: 767, 768, 1023px.

Homepage bands, top to bottom (observed):
1. Navigation
   - Desktop: summary: White corporate header; OrangeRed horizontal logo left, four text navigation groups and one capsule CTA right.; ground: #FFFFFF; height: 106; border: 0px; header shadow 0 4px 10px rgba(89,89,89,0.1); logo: {"variant": "OrangeRed full lockup", "px": "134 × 37", "position": "x150 y34"}; links: {"count": 4, "labels": ["Company", "Values", "News", "Support"], "size": 16, "weight": 600, "color": "#000000", "alignment": "right; Company is active with a 1px underline"}; actions: ["Visit Reddit"]; sticky: Header z-index 999; see live computed positioning evidence work/home-finalprobe.json.; phone: {"what_shows": "62px white bar; logo x15 y16 107 × 30; hamburger at right", "menu": "Closed at rest; navigation lives in mobile menu with the same ordered groups", "CTA": "Visit Reddit is inside the menu, not in the resting top bar"}; dropdowns: {"Company": ["About", "Press", "Careers", "Brand", "Investors"], "Values": ["Our values", "Privacy", "Transparency", "Reddit for Good"], "News": ["Newsroom", "Announcements", "Product and Community", "Policy and Safety", "Life at Reddit"], "Support": ["Support", "Reddit help center", "Contact", "Reddit rules", "Press inquiries", "Legal requests", "Terms & policies", "Public content policy", "Privacy policy"]}; wayfinding_evidence: [{"label": "Company", "href": "https://redditinc.com/"}, {"label": "About", "href": "https://redditinc.com/"}, {"label": "Press", "href": "https://redditinc.com/press"}, {"label": "Careers", "href": "https://redditinc.com/careers"}, {"label": "Brand", "href": "https://redditinc.com/brand"}, {"label": "Investors", "href": "https://investor.redditinc.com/"}, {"label": "Values", "href": "https://redditinc.com/values"}, {"label": "Our values", "href": "https://redditinc.com/values"}, {"label": "Privacy", "href": "https://redditinc.com/privacy"}, {"label": "Transparency", "href": "https://redditinc.com/transparency"}, {"label": "Reddit for Good", "href": "https://redditinc.com/reddit-for-good"}, {"label": "News", "href": "https://redditinc.com/news"}, {"label": "Newsroom", "href": "https://redditinc.com/news"}, {"label": "Announcements", "href": "https://redditinc.com/news/tag/announcements"}, {"label": "Product and Community", "href": "https://redditinc.com/news/tag/product-and-community"}, {"label": "Policy and Safety", "href": "https://redditinc.com/news/tag/policy-and-safety"}, {"label": "Life at Reddit", "href": "https://redditinc.com/news/tag/life-at-reddit"}, {"label": "Support", "href": "https://redditinc.com/support"}, {"label": "Support", "href": "https://redditinc.com/support"}, {"label": "Reddit help center", "href": "https://support.reddithelp.com/hc/en-us"}, {"label": "Contact", "href": "https://support.reddithelp.com/hc/en-us/requests/new"}, {"label": "Reddit rules", "href": "https://redditinc.com/policies/reddit-rules"}, {"label": "Press inquiries", "href": "https://redditinc.com/press"}, {"label": "Legal requests", "href": "https://legalrequests.reddithelp.com/hc/en-us"}, {"label": "Terms & policies", "href": "https://redditinc.com/policies"}, {"label": "Public content policy", "href": "https://support.reddithelp.com/hc/en-us/articles/26410290525844-Public-Content-Policy"}, {"label": "Privacy policy", "href": "https://www.reddit.com/policies/privacy-policy"}, {"label": "Company", "href": "https://redditinc.com/"}, {"label": "About", "href": "https://redditinc.com/"}, {"label": "Press", "href": "https://redditinc.com/press"}, {"label": "Careers", "href": "https://redditinc.com/careers"}, {"label": "Brand", "href": "https://redditinc.com/brand"}, {"label": "Investors", "href": "https://investor.redditinc.com/"}, {"label": "Values", "href": "https://redditinc.com/values"}, {"label": "Our values", "href": "https://redditinc.com/values"}, {"label": "Privacy", "href": "https://redditinc.com/privacy"}, {"label": "Transparency", "href": "https://redditinc.com/transparency"}, {"label": "Reddit for Good", "href": "https://redditinc.com/reddit-for-good"}, {"label": "News", "href": "https://redditinc.com/news"}, {"label": "Newsroom", "href": "https://redditinc.com/news"}, {"label": "Announcements", "href": "https://redditinc.com/news/tag/announcements"}, {"label": "Product and Community", "href": "https://redditinc.com/news/tag/product-and-community"}, {"label": "Policy and Safety", "href": "https://redditinc.com/news/tag/policy-and-safety"}, {"label": "Life at Reddit", "href": "https://redditinc.com/news/tag/life-at-reddit"}, {"label": "Support", "href": "https://redditinc.com/support"}, {"label": "Support", "href": "https://redditinc.com/support"}, {"label": "Reddit help center", "href": "https://support.reddithelp.com/hc/en-us"}, {"label": "Contact", "href": "https://support.reddithelp.com/hc/en-us/requests/new"}, {"label": "Reddit rules", "href": "https://redditinc.com/policies/reddit-rules"}, {"label": "Press inquiries", "href": "https://redditinc.com/press"}, {"label": "Legal requests", "href": "https://legalrequests.reddithelp.com/hc/en-us"}, {"label": "Terms & policies", "href": "https://redditinc.com/policies"}, {"label": "Public content policy", "href": "https://support.reddithelp.com/hc/en-us/articles/26410290525844-Public-Content-Policy"}, {"label": "Privacy policy", "href": "https://www.reddit.com/policies/privacy-policy"}, {"label": "Visit Reddit", "href": "https://www.reddit.com/"}, {"label": "Visit Reddit", "href": "https://www.reddit.com/"}, {"label": "Company", "href": "javascript:;"}, {"label": "Reddit, Inc.", "href": "https://redditinc.com/"}, {"label": "Reddit for Business", "href": "https://business.reddit.com/"}, {"label": "Careers", "href": "https://redditinc.com/careers"}, {"label": "Investors", "href": "http://investor.redditinc.com/"}, {"label": "Press Contact", "href": "https://redditinc.com/press"}, {"label": "News", "href": "https://redditinc.com/news"}, {"label": "r/RDDT", "href": "https://www.reddit.com/r/RDDT/"}, {"label": "Community", "href": "javascript:;"}, {"label": "Reddit.com", "href": "https://www.reddit.com/r/reddit/"}, {"label": "Reddit for Community", "href": "https://redditforcommunity.com/"}, {"label": "Reddit Rules", "href": "https://redditinc.com/policies/reddit-rules"}, {"label": "Help Center", "href": "https://reddit.zendesk.com/hc"}, {"label": "Moderator Code of Conduct", "href": "https://redditinc.com/policies/moderator-code-of-conduct"}, {"label": "Privacy & Safety", "href": "javascript:;"}, {"label": "Privacy Policy", "href": "https://www.reddit.com/policies/privacy-policy"}, {"label": "User Agreement", "href": "https://redditinc.com/policies/user-agreement"}, {"label": "Transparency Report", "href": "https://redditinc.com/transparency"}, {"label": "r/redditsafety", "href": "https://www.reddit.com/r/redditsafety/"}, {"label": "Other Terms and Policies", "href": "https://redditinc.com/policies"}, {"label": "Your Privacy Choices", "href": "https://redditinc.com/#"}, {"label": "Reddit, Inc.", "href": "https://redditinc.com/"}]
   - Phone: 62px fixed white bar; logo107 ×30 at15,16; Menu label + hamburger; closed at rest
   - Desktop height106px; phone62px.
2. Hero
   - Desktop: band: y106–706, 600px high; padding 96px 0; column_split: 972px centered content x234–1206; two 474px columns, 24px grid gap; vertical_anchors: H1 x234 y219 474 × 140; body x234 y400 474 × 173; Snoo x769 y202 400 × 400; text_max_width: 474; media_frame: 400 × 400; transparent PNG, no border/radius, no overlap; CTA_size: none
   - Phone: band: OrangeRed y62–857; inner measured row y110–809, 48px top/bottom padding; order: H1, body, Snoo; alignment: left text x20, width350; centered image; sizes: H1 48/48, 2 lines y110–206; body16/23 y247–385; Snoo350 ×350 x20 y453; headline break The heart of the / internet
   - Waving Snoo image is static. No hero carousel or hero CTA.
3. How does Reddit work?
   - Desktop: band: White section from y706; 100px top gap; measured content y806–1287; layout: x234–1206 width972; collage x234 y806 474 ×474; copy x772 width434; type: H2 y875 40/50 800, 2 lines; body y995 20/28.8,4 lines; CTA x772 y1171 161 ×47
   - Phone: order: copy first, CTA, collage; layout: x20 width350; title y905 28/35 single line; body y952 16/23 4 lines; CTA y1104 140 ×41; collage x20 y1193 350 ×350; spacing: 48px after CTA before collage; next section begins y1597
   - Use the actual collage PNG; rounded conversation-bubble silhouette and multicolored subreddit pills are baked into artwork.
   - Static resting collage shows r/personalfinance, r/battlestations, r/LifeProTips, r/unpopularopinion, r/crypto, r/palmtrees, r/futurology, r/aww, r/bestof, r/gaming, r/history, r/pics, r/biology and r/law among edge-cropped pills. Marquee movement is animation only.
   - Centered OrangeRed circular video play button with white right triangle; resting button scale1, hover scale1.07, transition .3s. Modal/video playback is interaction only.
   - Visit Reddit: white bold text on OrangeRed capsule; title to body20px desktop/12px phone; body to CTA60px.
4. Post
   - Desktop: band: y1287–1895; height608px; padding 100px 15px; title: x254 y1507, 512px wide,40/50 weight800; body: x254 y1617,512px wide,20/28.8,2 lines; media: x806 y1387,380 ×400, contain
   - Phone: band: y1597–2172; next row separated by48px; order: title, body, image for all three rows; layout: x15 width360; title28/35 weight800 at y1597; body16/23 at y1672; image360 ×400 at y1766; spacing: 40px between title bottom and body;48px between body bottom and image top
   - One heading only: raw measurements include a nested heading wrapper; do not render its duplicate.
   - Phone screenshots, speech bubbles, UI controls and colored rounded square are a single transparent PNG; use contain, no CSS recreation.
   - Desktop title-bottom to body-top60px; all copy left-aligned.
5. Comment
   - Desktop: band: y1895–2303; height408px; padding 0px; title: x694 y2015, 512px wide,40/50 weight800; body: x694 y2125,512px wide,20/28.8,2 lines; media: x234 y1895,380 ×400, contain
   - Phone: band: y2221–2796; next row separated by48px; order: title, body, image for all three rows; layout: x15 width360; title28/35 weight800 at y2221; body16/23 at y2296; image360 ×400 at y2390; spacing: 40px between title bottom and body;48px between body bottom and image top
   - One heading only: raw measurements include a nested heading wrapper; do not render its duplicate.
   - Phone screenshots, speech bubbles, UI controls and colored rounded square are a single transparent PNG; use contain, no CSS recreation.
   - Desktop title-bottom to body-top60px; all copy left-aligned.
6. Vote
   - Desktop: band: y2303–2911; height608px; padding 100px 15px; title: x254 y2523, 512px wide,40/50 weight800; body: x254 y2633,512px wide,20/28.8,2 lines; media: x806 y2403,380 ×400, contain
   - Phone: band: y2844–3419; next row separated by48px; order: title, body, image for all three rows; layout: x15 width360; title28/35 weight800 at y2844; body16/23 at y2919; image360 ×400 at y3013; spacing: 40px between title bottom and body;48px between body bottom and image top
   - One heading only: raw measurements include a nested heading wrapper; do not render its duplicate.
   - Phone screenshots, speech bubbles, UI controls and colored rounded square are a single transparent PNG; use contain, no CSS recreation.
   - Desktop title-bottom to body-top60px; all copy left-aligned.
7. Reddit by the numbers
   - Desktop: band: y2911–3603, padding100px 15px; centered width972 x234; intro: H2 x234 y3011 48/50; lead y3086 20/28.8; date below at14px; cards: 4 columns; x234,482,730,978; 228px wide,160px high; gap20px; y3218; radius24px; padding30px 24px 24px; cta: Reddit press x633 y3454 173 ×49
   - Phone: band: Black background begins y3467; content y3515–4410 with48px top/bottom padding; intro: x20 width350; heading32/33, lead16/23; date below; cards: one column centered,220px wide; x85; card tops3713,3877,4041,4205;140px high,24px gaps; padding24px; cta: x126 y4370 138 ×39
   - Screenshot overrides raw inherited colors: the section H2, lead and date render white on black, despite measurements reporting black for nested text.
   - Stat cards are white, radius24px; values OrangeRed; labels black16px desktop and14px phone.
   - As of September 30, 2026
   - 130M — Daily active uniques
   - 515M — Weekly active uniques
   - 100K+ — Active communities
   - 27B — Posts & comments
   - Use these published figures as the static resting state. 0M/0K+/0B seen before scroll are animation initialization only; count-up interpolation is animation only.
8. Reddit news
   - Desktop: band: y3603–4775; content x234 y3703 width972;100px vertical padding; grid: 2 columns466px,32px gap; first row images y3778 466 ×258; second y4202; radius25px; text: image bottom +20px to title; title20/28.8 weight700; date20/28.8 weight400,20px below title; cta: View more blog posts centered beneath cards
   - Phone: band: white starts y4458; content heading y4505; width350 x20; grid: single column; images y4564,4919,5274,5606;350 ×206 except last350 ×200; radius25px; text: title16/23 weight700,20px after image; date16/23 with20px top gap; cta: View more blog posts x91 y5961 207 ×39; white section ends y6048
   - Each card is one anchor; no outer visible border, shadow or tinted card ground.
   - Keep original news imagery, cropped to measured image boxes with object-fit:cover.
   - Reading order is row-major on desktop and top-to-bottom on phone.
9. Footer
   - Desktop: 1140px inner width x150–1290; three columns beside logo
   - Phone: band: Black begins around y6048; full page ends7200; order: logo, social icons, Company column, Community column, Privacy & Safety column, Your Privacy Choices, legal line; layout: 15px side gutters; columns stacked, heading24px; link16px with ~39px step; social row follows logo; privacy utility right-aligned; legal left-aligned at bottom
   - Outer desktop footer starts y4775,53px top padding; inner x150–1290 width1140; OrangeRed logo134 ×37 at x150 y4828.
   - Desktop columns begin around x640,842,1109; heading24px/700 OrangeRed; links16px/400 white;40px line step.
   - Social order: Facebook, Instagram, Twitter (X glyph), Youtube, Linkedin; native white SVGs;24px icon height,16px gaps, YouTube width34px.
   - Your Privacy Choices is right-aligned above legal line. Copyright line right-aligned at bottom;16px links and12px muted #737577 legal text.
   - Company: Reddit, Inc.; Reddit for Business; Careers; Investors; Press Contact; News; r/RDDT
   - Community: Reddit.com; Reddit for Community; Reddit Rules; Help Center; Moderator Code of Conduct
   - Privacy & Safety: Privacy Policy; User Agreement; Transparency Report; r/redditsafety; Other Terms and Policies
   - Copyright 2026 Reddit, Inc. All rights reserved.
   - No public street address or telephone number is printed on this homepage.

## Page anatomy

How Reddit's own landing pages are built, part by part (observed; https://redditinc.com/, 2026-10-31). A homepage pattern, not a brand law: follow it for landing pages.

**Announcement bar**
- 0: n
- 1: o
- 2: n
- 3: e

**Navigation**
- summary: White corporate header; OrangeRed horizontal logo left, four text navigation groups and one capsule CTA right.
- ground: #FFFFFF
- height: 106
- border: 0px; header shadow 0 4px 10px rgba(89,89,89,0.1)
- logo: variant OrangeRed full lockup; px 134 × 37; position x150 y34
- links: count 4; labels ["Company", "Values", "News", "Support"]; size 16; weight 600; color #000000; alignment right; Company is active with a 1px underline
- actions:
  - Visit Reddit
- sticky: position:fixed; top0; z-index999; white header stays visible while scrolling; reserve106px desktop/62px phone in document flow.
- phone: what shows 62px white fixed bar; logo x15 y16 107 ×30; literal Menu label plus three-line hamburger at right; menu Closed at rest; navigation lives in mobile menu with the same ordered groups; CTA Visit Reddit is inside the menu, not in the resting top bar
- dropdowns: Company ["About", "Press", "Careers", "Brand", "Investors"]; Values ["Our values", "Privacy", "Transparency", "Reddit for Good"]; News ["Newsroom", "Announcements", "Product and Community", "Policy and Safety", "Life at Reddit"]; Support ["Support", "Reddit help center", "Contact", "Reddit rules", "Press inquiries", "Legal requests", "Terms & policies", "Public content policy", "Privacy policy"]
- wayfinding evidence:
  - {"label":"Company","href":"https://redditinc.com/"}
  - {"label":"About","href":"https://redditinc.com/"}
  - {"label":"Press","href":"https://redditinc.com/press"}
  - {"label":"Careers","href":"https://redditinc.com/careers"}
  - {"label":"Brand","href":"https://redditinc.com/brand"}
  - {"label":"Investors","href":"https://investor.redditinc.com/"}
  - {"label":"Values","href":"https://redditinc.com/values"}
  - {"label":"Our values","href":"https://redditinc.com/values"}
  - {"label":"Privacy","href":"https://redditinc.com/privacy"}
  - {"label":"Transparency","href":"https://redditinc.com/transparency"}
  - {"label":"Reddit for Good","href":"https://redditinc.com/reddit-for-good"}
  - {"label":"News","href":"https://redditinc.com/news"}
  - {"label":"Newsroom","href":"https://redditinc.com/news"}
  - {"label":"Announcements","href":"https://redditinc.com/news/tag/announcements"}
  - {"label":"Product and Community","href":"https://redditinc.com/news/tag/product-and-community"}
  - {"label":"Policy and Safety","href":"https://redditinc.com/news/tag/policy-and-safety"}
  - {"label":"Life at Reddit","href":"https://redditinc.com/news/tag/life-at-reddit"}
  - {"label":"Support","href":"https://redditinc.com/support"}
  - {"label":"Support","href":"https://redditinc.com/support"}
  - {"label":"Reddit help center","href":"https://support.reddithelp.com/hc/en-us"}
  - {"label":"Contact","href":"https://support.reddithelp.com/hc/en-us/requests/new"}
  - {"label":"Reddit rules","href":"https://redditinc.com/policies/reddit-rules"}
  - {"label":"Press inquiries","href":"https://redditinc.com/press"}
  - {"label":"Legal requests","href":"https://legalrequests.reddithelp.com/hc/en-us"}
  - {"label":"Terms & policies","href":"https://redditinc.com/policies"}
  - {"label":"Public content policy","href":"https://support.reddithelp.com/hc/en-us/articles/26410290525844-Public-Content-Policy"}
  - {"label":"Privacy policy","href":"https://www.reddit.com/policies/privacy-policy"}
  - {"label":"Company","href":"https://redditinc.com/"}
  - {"label":"About","href":"https://redditinc.com/"}
  - {"label":"Press","href":"https://redditinc.com/press"}
  - {"label":"Careers","href":"https://redditinc.com/careers"}
  - {"label":"Brand","href":"https://redditinc.com/brand"}
  - {"label":"Investors","href":"https://investor.redditinc.com/"}
  - {"label":"Values","href":"https://redditinc.com/values"}
  - {"label":"Our values","href":"https://redditinc.com/values"}
  - {"label":"Privacy","href":"https://redditinc.com/privacy"}
  - {"label":"Transparency","href":"https://redditinc.com/transparency"}
  - {"label":"Reddit for Good","href":"https://redditinc.com/reddit-for-good"}
  - {"label":"News","href":"https://redditinc.com/news"}
  - {"label":"Newsroom","href":"https://redditinc.com/news"}
  - {"label":"Announcements","href":"https://redditinc.com/news/tag/announcements"}
  - {"label":"Product and Community","href":"https://redditinc.com/news/tag/product-and-community"}
  - {"label":"Policy and Safety","href":"https://redditinc.com/news/tag/policy-and-safety"}
  - {"label":"Life at Reddit","href":"https://redditinc.com/news/tag/life-at-reddit"}
  - {"label":"Support","href":"https://redditinc.com/support"}
  - {"label":"Support","href":"https://redditinc.com/support"}
  - {"label":"Reddit help center","href":"https://support.reddithelp.com/hc/en-us"}
  - {"label":"Contact","href":"https://support.reddithelp.com/hc/en-us/requests/new"}
  - {"label":"Reddit rules","href":"https://redditinc.com/policies/reddit-rules"}
  - {"label":"Press inquiries","href":"https://redditinc.com/press"}
  - {"label":"Legal requests","href":"https://legalrequests.reddithelp.com/hc/en-us"}
  - {"label":"Terms & policies","href":"https://redditinc.com/policies"}
  - {"label":"Public content policy","href":"https://support.reddithelp.com/hc/en-us/articles/26410290525844-Public-Content-Policy"}
  - {"label":"Privacy policy","href":"https://www.reddit.com/policies/privacy-policy"}
  - {"label":"Visit Reddit","href":"https://www.reddit.com/"}
  - {"label":"Visit Reddit","href":"https://www.reddit.com/"}
  - {"label":"Company","href":"javascript:;"}
  - {"label":"Reddit, Inc.","href":"https://redditinc.com/"}
  - {"label":"Reddit for Business","href":"https://business.reddit.com/"}
  - {"label":"Careers","href":"https://redditinc.com/careers"}
  - {"label":"Investors","href":"http://investor.redditinc.com/"}
  - {"label":"Press Contact","href":"https://redditinc.com/press"}
  - {"label":"News","href":"https://redditinc.com/news"}
  - {"label":"r/RDDT","href":"https://www.reddit.com/r/RDDT/"}
  - {"label":"Community","href":"javascript:;"}
  - {"label":"Reddit.com","href":"https://www.reddit.com/r/reddit/"}
  - {"label":"Reddit for Community","href":"https://redditforcommunity.com/"}
  - {"label":"Reddit Rules","href":"https://redditinc.com/policies/reddit-rules"}
  - {"label":"Help Center","href":"https://reddit.zendesk.com/hc"}
  - {"label":"Moderator Code of Conduct","href":"https://redditinc.com/policies/moderator-code-of-conduct"}
  - {"label":"Privacy & Safety","href":"javascript:;"}
  - {"label":"Privacy Policy","href":"https://www.reddit.com/policies/privacy-policy"}
  - {"label":"User Agreement","href":"https://redditinc.com/policies/user-agreement"}
  - {"label":"Transparency Report","href":"https://redditinc.com/transparency"}
  - {"label":"r/redditsafety","href":"https://www.reddit.com/r/redditsafety/"}
  - {"label":"Other Terms and Policies","href":"https://redditinc.com/policies"}
  - {"label":"Your Privacy Choices","href":"https://redditinc.com/#"}
  - {"label":"Reddit, Inc.","href":"https://redditinc.com/"}

**Hero**
- summary: Full-width solid OrangeRed band; black two-line headline and body left, waving dimensional Snoo right.
- desktop: band y106–706, 600px high; padding 96px 0; column split 972px centered content x234–1206; two 474px columns, 24px grid gap; vertical anchors H1 x234 y219 474 × 140; body x234 y400 474 × 173; Snoo x769 y202 400 × 400; text max width 474; media frame 400 × 400; transparent PNG, no border/radius, no overlap; CTA size none
- phone: band OrangeRed y62–857; inner measured row y110–809, 48px top/bottom padding; order H1, body, Snoo; alignment left text x20, width350; centered image; sizes H1 48/48, 2 lines y110–206; body16/23 y247–385; Snoo350 ×350 x20 y453; line break The heart of the / internet; use phone-specific break, unlike desktop The heart of / the internet
- at rest: Waving Snoo image is static. No hero carousel or hero CTA.
- media: https://redditinc.com/hubfs/Reddit%20Inc/Graphics/Headers/Desktop/RedditInc_Header_Homepage.png
- type: Real RedditDisplay-ExtraBold 800, 70/70 desktop and48/48 phone; body Reddit Sans400 20/28.8 desktop,16/23 phone.
- cta: none
- proof: none
- copy: heading The heart of the internet; desktop break The heart of / the internet; body Reddit is home to thousands of communities, endless conversation, and authentic human connection. Whether you’re into breaking news, sports, TV fan theories, or a never-ending stream of the internet’s cutest animals, there’s a community on Reddit for you.; phone break The heart of the / internet

**How does Reddit work?**
- summary: White two-column explainer: subreddit pill collage and circular play control on left, title/body/CTA on right.
- ground: #FFFFFF
- desktop: band White section from y706; 100px top gap; measured content y806–1287; layout x234–1206 width972; collage x234 y806 474 ×474; copy x772 width434; type H2 y875 40/50 800, 2 lines; body y995 20/28.8,4 lines; CTA x772 y1171 161 ×47
- phone: order copy first, CTA, collage; layout x20 width350; title y905 28/35 single line; body y952 16/23 4 lines; CTA y1104 140 ×41; collage x20 y1193 350 ×350; spacing 48px after CTA before collage; next section begins y1597
- anatomy:
  - Use the actual collage PNG; rounded conversation-bubble silhouette and multicolored subreddit pills are baked into artwork.
  - Static resting collage shows r/personalfinance, r/battlestations, r/LifeProTips, r/unpopularopinion, r/crypto, r/palmtrees, r/futurology, r/aww, r/bestof, r/gaming, r/history, r/pics, r/biology and r/law among edge-cropped pills. Marquee movement is animation only.
  - Centered OrangeRed circular video play button with white right triangle; resting button scale1, hover scale1.07, transition .3s. Modal/video playback is interaction only.
  - Visit Reddit: white bold text on OrangeRed capsule; title to body20px desktop/12px phone; body to CTA60px.
- components:
  - collage-video-trigger
  - primary-button
- media: https://redditinc.com/hubfs/Reddit%20Inc/Content/Home%20Page/RedditInc_HomePage_HowDoesRedditWork.png
- video poster: https://embed-ssl.wistia.com/deliveries/1429433d60aa9edc2e5596be0310f3239695f202.webp?image_crop_resized=1920x1080
- copy: Every day, millions of people around the world post, vote, and comment in communities organized around their interests.

**Post**
- summary: White explanatory row with one phone composite; text left, image right on desktop.
- ground: #FFFFFF
- desktop: band y1287–1895; height608px; padding 100px 15px; title x254 y1507, 512px wide,40/50 weight800; body x254 y1617,512px wide,20/28.8,2 lines; media x806 y1387,380 ×400, contain
- phone: band y1597–2172; next row separated by48px; order title, body, image for all three rows; layout x15 width360; title28/35 weight800 at y1597; body16/23 at y1672; image360 ×400 at y1766; spacing 40px between title bottom and body;48px between body bottom and image top
- anatomy:
  - One heading only: raw measurements include a nested heading wrapper; do not render its duplicate.
  - Phone screenshots, speech bubbles, UI controls and colored rounded square are a single transparent PNG; use contain, no CSS recreation.
  - Desktop title-bottom to body-top60px; all copy left-aligned.
- components:
  - alternating-media-row
- media: https://redditinc.com/hubfs/Reddit%20Inc/Content/Home%20Page/HOMEPAGE%20GRAPHICS%20_%20Post@2x.png
- copy: The community can share content by posting stories, links, images, and videos.

**Comment**
- summary: White explanatory row with one phone composite; image left, text right on desktop.
- ground: #FFFFFF
- desktop: band y1895–2303; height408px; padding 0px; title x694 y2015, 512px wide,40/50 weight800; body x694 y2125,512px wide,20/28.8,2 lines; media x234 y1895,380 ×400, contain
- phone: band y2221–2796; next row separated by48px; order title, body, image for all three rows; layout x15 width360; title28/35 weight800 at y2221; body16/23 at y2296; image360 ×400 at y2390; spacing 40px between title bottom and body;48px between body bottom and image top
- anatomy:
  - One heading only: raw measurements include a nested heading wrapper; do not render its duplicate.
  - Phone screenshots, speech bubbles, UI controls and colored rounded square are a single transparent PNG; use contain, no CSS recreation.
  - Desktop title-bottom to body-top60px; all copy left-aligned.
- components:
  - alternating-media-row
- media: https://redditinc.com/hubfs/Reddit%20Inc/Content/Home%20Page/HOMEPAGE%20GRAPHICS%20_%20Comment@2x.png
- copy: The community comments on posts. Comments provide discussion and often humor.

**Vote**
- summary: White explanatory row with one phone composite; text left, image right on desktop.
- ground: #FFFFFF
- desktop: band y2303–2911; height608px; padding 100px 15px; title x254 y2523, 512px wide,40/50 weight800; body x254 y2633,512px wide,20/28.8,2 lines; media x806 y2403,380 ×400, contain
- phone: band y2844–3419; next row separated by48px; order title, body, image for all three rows; layout x15 width360; title28/35 weight800 at y2844; body16/23 at y2919; image360 ×400 at y3013; spacing 40px between title bottom and body;48px between body bottom and image top
- anatomy:
  - One heading only: raw measurements include a nested heading wrapper; do not render its duplicate.
  - Phone screenshots, speech bubbles, UI controls and colored rounded square are a single transparent PNG; use contain, no CSS recreation.
  - Desktop title-bottom to body-top60px; all copy left-aligned.
- components:
  - alternating-media-row
- media: https://redditinc.com/hubfs/Reddit%20Inc/Content/Home%20Page/HOMEPAGE%20GRAPHICS%20_%20Vote@2x.png
- copy: Comments & posts can be upvoted or downvoted. The most interesting content rises to the top.

**Reddit by the numbers**
- summary: Full-width black statistics band with white introduction, dated source, four white rounded stat cards and a centered OrangeRed CTA.
- ground: #000000
- desktop: band y2911–3603, padding100px 15px; centered width972 x234; intro H2 x234 y3011 48/50; lead y3086 20/28.8; date below at14px; cards 4 columns; x234,482,730,978; 228px wide,160px high; gap20px; y3218; radius24px; padding30px 24px 24px; cta Reddit press x633 y3454 173 ×49
- phone: band Black background begins y3467; content y3515–4410 with48px top/bottom padding; intro x20 width350; heading32/33, lead16/23; date below; cards one column centered,220px wide; x85; card tops3713,3877,4041,4205;140px high,24px gaps; padding30px 24px 24px; cta x126 y4370 138 ×39
- anatomy:
  - Screenshot overrides raw inherited colors: the section H2, lead and date render white on black, despite measurements reporting black for nested text.
  - Stat cards are white, radius24px; values OrangeRed; labels black16px desktop and14px phone.
  - As of September 30, 2026
  - 130M — Daily active uniques
  - 515M — Weekly active uniques
  - 100K+ — Active communities
  - 27B — Posts & comments
  - Use these published figures as the static resting state. 0M/0K+/0B seen before scroll are animation initialization only; count-up interpolation is animation only.
- components:
  - stat-card
  - primary-button
- at rest: as of As of September 30, 2026; figures [{"value": "130M", "label": "Daily active uniques"}, {"value": "515M", "label": "Weekly active uniques"}, {"value": "100K+", "label": "Active communities"}, {"value": "27B", "label": "Posts & comments"}]

**Reddit news**
- summary: White latest-news section with heading, four linked image/title/date cards in reading order and centered CTA.
- ground: #FFFFFF
- desktop: band y3603–4775; content x234 y3703 width972;100px vertical padding; grid 2 columns466px,32px gap; first row images y3778 466 ×258; second y4202; radius25px; text image bottom +20px to title; title20/28.8 weight700; date20/28.8 weight400,20px below title; cta View more blog posts centered beneath cards
- phone: band white starts y4458; content heading y4505; width350 x20; grid single column; images y4564,4919,5274,5606;350 ×206 except last350 ×200; radius25px; text title16/23 weight700,20px after image; date16/23 with20px top gap; cta View more blog posts x91 y5961 207 ×39; white section ends y6048
- anatomy:
  - Each card is one anchor; no outer visible border, shadow or tinted card ground.
  - Keep original news imagery, cropped to measured image boxes with object-fit:cover.
  - Reading order is row-major on desktop and top-to-bottom on phone.
- components:
  - news-card
  - primary-button
- cards:
  - {"title":"Explore More Communities with Reddit’s New Feed Updates","date":"October 28, 2026","media":"https://redditinc.com/hubfs/BlogHeader_Snoo_Blue_005@2x.jpg"}
  - {"title":"Supporting Civic Knowledge and Participation for the 2026 US Elections","date":"October 13, 2026","media":"https://redditinc.com/hubfs/Reddit%20Inc/Content/Blog/Blog-Header_Elections_2800x1120.png"}
  - {"title":"Maria Angelidou-Smith to Depart Reddit","date":"October 07, 2026","media":"https://redditinc.com/hubfs/BlogHeader_Logo_003@2x-4.png"}
  - {"title":"Reddit Launches Enhanced Capabilities for Lead Generation","date":"October 06, 2026","media":"https://redditinc.com/hubfs/BlogHeader_Snoo_Yellow_002@2x.png"}

**Footer**
- summary: Black footer with OrangeRed lockup, three link columns, white social icons, privacy utility and muted legal line.
- ground: #000000
- anatomy:
  - Outer desktop footer starts y4775,53px top padding; inner x150–1290 width1140; OrangeRed logo134 ×37 at x150 y4828.
  - Desktop columns begin around x640,842,1109; heading24px/700 OrangeRed; links16px/400 white;40px line step.
  - Social order: Facebook, Instagram, Twitter (X glyph), Youtube, Linkedin; native white SVGs;24px icon height,16px gaps, YouTube width34px.
  - Your Privacy Choices is right-aligned above legal line. Copyright line right-aligned at bottom;16px links and12px muted #737577 legal text.
  - Company: Reddit, Inc.; Reddit for Business; Careers; Investors; Press Contact; News; r/RDDT
  - Community: Reddit.com; Reddit for Community; Reddit Rules; Help Center; Moderator Code of Conduct
  - Privacy & Safety: Privacy Policy; User Agreement; Transparency Report; r/redditsafety; Other Terms and Policies
  - Copyright 2026 Reddit, Inc. All rights reserved.
  - No public street address or telephone number is printed on this homepage.
- columns:
  - {"label":"Company","links":["Reddit, Inc.","Reddit for Business","Careers","Investors","Press Contact","News","r/RDDT"]}
  - {"label":"Community","links":["Reddit.com","Reddit for Community","Reddit Rules","Help Center","Moderator Code of Conduct"]}
  - {"label":"Privacy & Safety","links":["Privacy Policy","User Agreement","Transparency Report","r/redditsafety","Other Terms and Policies"]}
- utility:
  - Your Privacy Choices
- legal: Copyright 2026 Reddit, Inc. All rights reserved.
- phone: band Black begins around y6048; full page ends7200; order logo, social icons, Company column, Community column, Privacy & Safety column, Your Privacy Choices, legal line; layout 15px side gutters; columns stacked, heading24px; link16px with ~39px step; social row follows logo; privacy utility right-aligned; legal left-aligned at bottom

**On dark grounds**
- secondary button: none on homepage; guide secondary system retained separately
- link: #FFFFFF; footer links white
- muted text: #737577
- hairline: none in resting black sections
- logo variant: OrangeRed full lockup

## Components

- **primary button** (observed): anatomy OrangeRed fill and border; white Reddit Sans bold centered label; capsule radius40–50px; no icon., desktop explainer161 ×47,padding6px 24px,border3px; press173 ×49,padding8px 26px,border2px; header138 ×39,padding6px24px,border2px, phone explainer140 ×41; press138 ×39; news207 ×39, states note These states apply to .button class CTA; header/counter custom anchors may use module-specific rules. No disabled CTA is present.
  - hover (observed): background transparent, border 3px solid #FF4500, color #FF4500
  - focus (observed): background transparent, border 3px solid #FF4500, color #FF4500
  - pressed (observed): background transparent, border 3px solid #FF9550, color #FF4500
- **video trigger** (observed): anatomy Centered OrangeRed circle with white triangle; CSS circle over native collage, hover scale1.07; video modal closed at rest.
- **stat card** (observed): anatomy White radius24px, no border or shadow; padding30px24px24px desktop; value then black label; four columns become one centered column.
- **news card** (observed): anatomy Native image radius25px, title20px below, date20px below title; whole card links to article; no visible outer card.
- **feature row** (observed): anatomy Single native phone PNG plus one H2 and paragraph; desktop alternating, phone all text then image.
- **social** (observed): anatomy Original SVGs in Facebook,Instagram,Twitter,Youtube,Linkedin order; no drawn replacements.

## Motion tokens

| Name | Easing | Duration | Use | Label |
|---|---|---|---|---|
| Bubble activation |  |  | Directional or scale entrance with spring-like momentum, followed by modular expansion and sequencing. | published |

## Icon tokens

Grid not published, stroke not published (published).

## Signature moves

### Conversation Bubble

Where: Headline containers, community tags, image frames, layered content, wordmark counterforms, display typography and motion.
Do: Circle-derived form with rounded bottom tail. Radius X determines headline padding: 0.75X horizontally and 0.5X vertically. Body padding is 0.75X on every side. Tail rounding is 0.06X. Tail may point left or right but always stays at the bottom. Extend by moving anchor points; keep one radius across a composition. Headlines use Reddit Display ExtraBold with 1:1 leading; body uses Reddit Sans Bold at default leading.. A coherent bubble system per composition; collages have at most five layers and staggered headlines at most eight lines..
Don't: Rotate, vertically flip, remove tails, stretch corner geometry, mix radii, add shadows or overlay effects, obscure the focal image, or use disconnected staggered segments..

## Messaging: rules

People, conversations and interests are the published strategic center; mission and positioning focus on community knowledge and participation.

Why it works: Message the human exchange first; the visual system makes the same promise through connected bubbles.

|  |  |
|---|---|
| Official descriptor | Reddit is the heart of the internet |
| Official positioning | Where we discover and participate through real conversation |
| Pillar status | Three extraction pillars synthesize the foundation; not official named pillars |

- Center real conversation and shared interests rather than an unsupported product superlative.
- Treat the heart-of-the-internet description as the published descriptor, not a newly invented campaign claim.
- Adapt candor for consumer audiences and conversation-led relevance for business audiences.
- Use the qualitative proof in messaging.proof_points; no audience or performance statistics are published in these supplied sections.
- Don't Invented metrics, unsupported competitive rankings or promises that imply official endorsement of a community.

Real examples, to look at on Reddit's own pages (not for reuse):
- The guide opens with interests and conversation: https://redditbrand.lingoapp.com/s/Overview-orqY1E — Overview

Sources: https://redditbrand.lingoapp.com/s/Overview-orqY1E — Strategic foundation, https://redditbrand.lingoapp.com/s/Overview-orqY1E — Overview

## Voice: rules

The writing is candid conversation: welcoming, original, clever and familiar, with humor matched to context.

Why it works: The voice brings the same human warmth and eclectic character as Snoo and the imagery.

|  |  |
|---|---|
| Paragraph ceiling | 6 desktop lines or 100 words |
| Preferred paragraph length | 5 lines or 70 words |
| Audience split | Consumer: candor; Business: conversation for business |

- Use brief everyday phrasing that helps the reader quickly; avoid formality and technical language that would sound unnatural aloud.
- Assume good intent and frame guidance positively; avoid hostile or transactional language.
- Keep playful language away from sensitive posts, comments and communities.
- Use humor and meta references only when they add useful context rather than confusion.
- Create contextual moments of delight; silly vocabulary or punctuation alone does not achieve it.
- Explain directly and transparently in simple language.
- Plan a structure; write descriptive headings, short paragraphs and scannable lists.
- Keep paragraphs within 6 desktop lines or 100 words; preferably within 5 lines or 70 words.
- Read sentences aloud and rewrite difficult phrasing; use one consistent style.
- Avoid corporate jargon and clichés; bring a distinctive Reddit perspective.
- Don't Corporate jargon, clichés, unhelpful technical explanations, negative assumptions, confusing meta jokes or insensitive playfulness.

Do and don't:
- Do: "Here’s how to get started.". Illustrative: helpful everyday phrasing.
- Don't: "Commence utilization of this functionality.". Illustrative: needless technical formality.

Real examples, to look at on Reddit's own pages (not for reuse):
- Traits translated into writing characteristics: https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Brand voice
- Consumer line centered on content and comments: https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Sample messaging by audience
- Consumer line uses contextual humor: https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Sample messaging by audience
- Business line turns conversation into relevance: https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Sample messaging by audience

Sources: https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Brand voice, https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Sample messaging by audience, https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Balancing voice & tone, https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Composition, https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Break up content, https://redditbrand.lingoapp.com/s/Voice-and-tone-dJ214w — Pay attention to phrasing

## Logo: rules

Dimensional Snoo in an OrangeRed bubble with a geometric lowercase wordmark; bubble counterforms connect lettering to the graphic system.

Why it works: A friendly face makes Reddit recognizable; a repeatable lockup anchors varied community content.

|  |  |
|---|---|
| Clear space | 0.5 × wordmark x-height |
| Icon grid | Internal sizing annotated as 80% of diameter; eyes top aligns to center; bubble tail radius 6% X |
| Minimum reproduction size | not published |
| Wordmark at graphic scale | Spacing may use the wordmark vertical stroke instead of default margins |

- The primary icon faces forward with a friendly, relaxed expression and appears on external marketing and communication.
- Snoo head sits over OrangeRed, whether in a bubble, another approved frame or a full field.
- Align the top of Snoo’s ears with wordmark x-height; balance upper and lower overhang.
- Use half wordmark x-height as exterior clearance for contained and uncontained lockups.
- Anchor wordmark and logo components on the left; the wordmark should lead recognition.
- Use OrangeRed detached wordmark on white or black, or white on OrangeRed.
- On secondary colors and gradients, use the OrangeRed bubble lockup; on imagery use a container for legibility.
- Off-platform audience architecture uses Snoo, Reddit and for audience; on-platform may reduce to Snoo plus audience.
- For agreed partnerships, match optical x-heights and derive divider thickness from Snoo’s antenna; stacked divider spans the wider logo.
- Don't Alterations, replacement parts, arbitrary angles, recoloring, effects, warping, image fills, changed spacing and substitute typefaces.

Real examples, to look at on Reddit's own pages (not for reuse):
- Icon construction grid and framing variants: https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Construction
- Wordmark clear-space diagram: https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Placement
- Nine wordmark misuse examples: https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Misuse
- Lockup color applications: https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Color application
- Contained lockup over secondary colors and gradients: https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Secondary + gradient application
- Partnership x-height balance: https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Single-line lockup

Sources: https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Logo, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Construction, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Placement, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Misuse, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Color application, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Secondary + gradient application, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Single-line lockup, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Reddit icon, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Lockup, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Margins + placement, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Composition, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Wordmark, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Stages of reduction, https://redditbrand.lingoapp.com/s/Logo-d9x3n2 — Brand partnerships

## Color: rules

Primary OrangeRed, black and white distinguish Reddit speaking; bright secondary tonal families distinguish communities.

Why it works: Audience determines palette; tonal separation gives layered content legibility without arbitrary rainbow combinations.

|  |  |
|---|---|
| Numeric color proportions | not published; primary colors prioritized for brand and tonal secondaries for redditors |
| Full palette | See palette.extras for all 28 distinct published hex values; repeated colors are shared across roles |
| Gradients | Use supplied presets; exact stop positions and angles not published |

- Keep OrangeRed visible in primary brand compositions.
- Represent communities with a secondary family and its highlights/tints.
- Separate adjacent content using tonal contrast; avoid similar secondary colors that vibrate on screens.
- Use only black or white type on colored backgrounds, respecting typography-specific approved examples.
- Use tertiary shades for product, websites and illustration depth; avoid them in high-visibility marketing except illustration.
- Reserve tertiary gradients for seasonal campaigns, events and partnerships, with OrangeRed-team approval.
- Gradient presets: Mango Highlight→Tint #FFDE55 to #F0FFB3; Dragonfruit #FF9FDF to #FFF3C0; Cantaloupe #E4FF45 to #FFF3C0; Honeydew #92FFEA to #F0FFB3.
- Normal→Highlight presets: Mango #FF4500 / #FFBF0B / #FFDE55; Dragonfruit #FF5FC2 / #FF9FDF / #FFDE55; Cantaloupe #AEEF0F / #E4FF45 / #FFDE55; Honeydew #00E2B7 / #92FFEA / #E4FF45.
- Don't Low contrast, secondary tints on white, drop shadows, or an undifferentiated community tag and caption in one color.

Do and don't:
- Do: "Find your community". Black type on OrangeRed is a published pairing.
- Don't: "Find your community". White type on a secondary color is shown as misuse.

Real examples, to look at on Reddit's own pages (not for reuse):
- Primary OrangeRed and community palette: https://redditbrand.lingoapp.com/s/Color-R7y72J — Color
- Eight seasonal gradient presets with printed stops: https://redditbrand.lingoapp.com/s/Color-R7y72J — Tertiary gradients
- Approved relationships across tonal families: https://redditbrand.lingoapp.com/s/Color-R7y72J — Color relationships
- Contrast approval and rejection: https://redditbrand.lingoapp.com/s/Color-R7y72J — Achieving contrast
- Color misuse panel: https://redditbrand.lingoapp.com/s/Color-R7y72J — Misuse

Sources: https://redditbrand.lingoapp.com/s/Color-R7y72J — Primary colors, https://redditbrand.lingoapp.com/s/Color-R7y72J — Color, https://redditbrand.lingoapp.com/s/Color-R7y72J — Tertiary gradients, https://redditbrand.lingoapp.com/s/Color-R7y72J — Color relationships, https://redditbrand.lingoapp.com/s/Color-R7y72J — Achieving contrast, https://redditbrand.lingoapp.com/s/Color-R7y72J — Misuse, https://redditbrand.lingoapp.com/s/Color-R7y72J — Color proportions, https://redditbrand.lingoapp.com/s/Color-R7y72J — Secondary colors, https://redditbrand.lingoapp.com/s/Color-R7y72J — Tertiary colors

## Typography: rules

Warm humanist Reddit Sans carries everyday content; heavy geometric Reddit Display adds bubble counterforms at headline scale.

Why it works: Large x-height and disambiguated characters support readability, while display geometry makes conversation visible.

|  |  |
|---|---|
| Display leading | font size × 1 |
| Optional Sans leading | font size × 1.25 |
| Slash angle | 67.5° |
| Headline pixel scale | not published |
| Fonts | Open local Sans, Sans Condensed and Mono; Display and Chocolate remain proprietary |
| Display tracking | 0 (published diagram); preserve the font’s default |

- Use Reddit Sans for approximately 90% of typesetting, especially captions, attribution and long copy.
- Use Reddit Display for headlines and large titles; bubble headline examples use ExtraBold.
- Use Chocolate for subheaders, bylines, marketing and webpages, rather than large headlines.
- Use Condensed only for high character counts in constrained spaces such as UI, business decks or environmental design.
- Use Mono for code, monospaced numerals, case-specific marketing and Business Marketing headlines.
- Left-align headlines and body except single-word bubble containers and staggered bubble layouts.
- Keep Display’s tight default tracking and 1:1 leading. Use Sans default leading, or 1.25 when more is needed.
- Use at most 2–3 type sizes in a composition; small caps are reserved for attribution/disambiguation.
- Favor black body text. Approved type color order is black/white, black/OrangeRed, white/OrangeRed, OrangeRed/white, white/black, then black/secondary.
- Use natural mixed-case Display headlines; misuse panels reject all-uppercase, all-lowercase and Reddit Sans headline treatments. Avoid mixing weights in one headline or setting Display as paragraph text.
- Don't Justification, colored body text, drop shadows, tracked-out lowercase, excessive sizes, centered text blocks, or colored display copy other than OrangeRed.

Do and don't:
- Do: "A place to ask". Left-aligned clear text; sample wording is illustrative.
- Don't: "A  p l a c e  t o  a s k". Do not track out lowercase text.

Real examples, to look at on Reddit's own pages (not for reuse):
- Display and Sans family overview: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Typography
- Slash angle and disambiguated characters: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Sans
- Proprietary Chocolate specimen: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Sans Chocolate
- Constrained-space Condensed specimen: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Sans Condensed
- Mono specimen: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Mono
- Proprietary Display specimen: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Display
- Left-aligned Display headline: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Setting type
- Default headline tracking annotated as zero: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Setting type
- Display leading set solid: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Setting type
- Approved type color combinations: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Color application
- Rejected color combinations and word highlights: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Typography color misuse
- Rejected type layouts, case and tracking: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Laying out type

Sources: https://redditbrand.lingoapp.com/s/Typography-d03Ney — Setting type, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Typography, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Sans, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Color application, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Typography color misuse, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Laying out type, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Sans Chocolate, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Sans Condensed, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Mono, https://redditbrand.lingoapp.com/s/Typography-d03Ney — Reddit Display

## Graphic elements: rules

The Conversation Bubble is the signature graphic component, a circle with a softly rounded bottom tail extended into containers.

Why it works: One recognizable shape can hold any format while keeping community content central.

|  |  |
|---|---|
| Circle radius | X |
| Tail rounding | 6% X |
| Headline padding | 75% X horizontal; 50% X vertical |
| Body padding | 75% X all sides |
| Staggered maximum | 8 lines |
| Collage maximum | 5 layers |

- Choose single-story for brief copy and tags; multi-line for longer headlines and paragraphs.
- Tail may face either side but must remain at the bottom; keep one corner radius across each composition.
- Headline padding is 75% radius on sides, 50% top/bottom. Body padding is 75% radius on every side.
- Single-story vertical margins match headline x-height; establish geometry from the largest bubble first.
- Staggered headlines follow natural speaking cadence; use consistent text size and connect consecutive same-side segments vertically.
- Limit staggered headlines to eight lines; 10–20 words is the suggested use case.
- Construct frames from a headline-sized bubble then move anchors outward; do not distort curves by scaling the whole shape.
- Cut out a purposeful focal subject to overlap the frame; preserve enough contour to recognize the bubble.
- Horizontal layered bubbles alternate image and color content at flush boundaries; distribute width by content quantity.
- Vertical layers segment logo, text, image and community information; maintain equal widths and a connected community tag.
- Collages use a clear focal image, grid alignment, consistent radius and at most five layers.
- Don't Missing tails, arbitrary rotations, inconsistent padding/radii, tiny text in oversized single-story bubbles, or multi-line copy in a single-story treatment.
- Don't Staggered segments with multiple tails, gaps, incorrect leading, extra frames or mixed colors.
- Don't Frame-in-frame treatments, split frames, awkward crops, rotated frames, shadows or doubled bubble shadows.
- Don't Layered bubbles from opposing directions, nonflush boundaries, exposed tails at internal overlaps, larger overlapping containers, barely offset layers or adjacent competing colors.
- Don't Vertical stacks with tapered widths, detached community tags, or mixed horizontal/vertical layering.
- Don't Collages with obscured subjects, similar visual density, mixed secondary hues, excessive details or opacity/overlay effects.

Do and don't:
- Do: "r/yourcommunity". One radius, bottom tail, consistent headline padding.
- Don't: "r/yourcommunity". Do not rotate bubbles or remove tails; visual construction is in chapter examples.

Real examples, to look at on Reddit's own pages (not for reuse):
- Six foundational bubble treatments: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Conversation Bubble
- Single-story construction and 6% tail rounding: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Construction
- Single-story misuse: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Single-story Bubble misuse
- Multi-line headline and paragraph geometry: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Multi-line Bubbles
- Staggered speech cadence: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Staggered Bubbles
- Staggered misuse: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Staggered Bubble misuse
- Purposeful foreground extrusion: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Masking and layering
- Frame misuse: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Bubble frame misuse
- Flush horizontal content bands: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubbles (horizontal)
- Layered horizontal misuse: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubble (horizontal) misuse

Sources: https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Conversation Bubble, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Single-story Bubbles, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Orientation, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Multi-line Bubbles, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Construction, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Staggered Bubbles, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Bubble frames, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Masking and layering, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubbles (horizontal), https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubbles (vertical), https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubble collages, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Single-story Bubble misuse, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Staggered Bubble misuse, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Bubble frame misuse, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubble (horizontal) misuse, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubble (vertical) misuse, https://redditbrand.lingoapp.com/s/Conversation-Bubble-orE96r — Layered Bubble collage misuse

## Iconography: rules

The Reddit share icon uses the supplied full-color dimensional Snoo; action badges pair the icon with short prompts.

Why it works: Consistent sharing assets retain recognition outside the platform.

|  |  |
|---|---|
| Community name threshold | More than 15 characters including r/ switches to icon |
| Badge minimum size / padding | not published |
| Other UI icon grid / stroke scale | not published |

- Prioritize the primary full-color icon; reduced-color assets only when necessary.
- Use supplied Ask, Discuss, Find, Post, Read, Share and Upvote badges to link viewers to Reddit content.
- Keep the icon within a badge and provide contrast and breathing room.
- Community and user prefixes remain lowercase r/ and u/.
- Default community lockup uses the Reddit pill; if name length including r/ exceeds 15 characters, use the icon. Also use the icon variant on OrangeRed.
- Customizable badge templates reference Chocolate ExtraBold; community lockups reference Display ExtraBold.
- Don't Recoloring, arbitrary angles, removing icons/tails, altered radius/length, added effects, distortion, different typefaces or low contrast.

Real examples, to look at on Reddit's own pages (not for reuse):
- Primary share icon: https://redditbrand.lingoapp.com/s/Social-PXzmWE — Share icons
- Action share badge: https://redditbrand.lingoapp.com/s/Social-PXzmWE — Share badges
- Sharing badge misuse panel: https://redditbrand.lingoapp.com/s/Social-PXzmWE — Misuse
- Pill and icon community lockups across backgrounds: https://redditbrand.lingoapp.com/s/Social-PXzmWE — Reddit + community name lockups

Sources: https://redditbrand.lingoapp.com/s/Social-PXzmWE — Share icons, https://redditbrand.lingoapp.com/s/Social-PXzmWE — Share badges, https://redditbrand.lingoapp.com/s/Social-PXzmWE — Misuse, https://redditbrand.lingoapp.com/s/Social-PXzmWE — Reddit + community name lockups, https://redditbrand.lingoapp.com/s/Social-PXzmWE — Communities and usernames

## Illustration: rules

Snoo and singular topic objects use a unified dimensional 3D style with soft rounded forms and tonal shading.

Why it works: Dimensional, approachable objects make a broad world of interests feel like one brand.

|  |  |
|---|---|
| Dimensional treatment | Unified 3D style |
| Lighting/material/render parameters | not published |

- Use the approved illustration library for Snoo and spot assets.
- Secondary head angles can direct attention to surrounding content but never replace the evergreen lockup pose.
- Express emotion through eyes, ears, mouth and antenna within the character construction.
- Request OrangeRed-team approval for seasonal and campaign Snoo customizations.
- Brand illustrations use OrangeRed tonal washes; community objects use one secondary tonal family.
- Put the family base color on prominent object features and use accents/tints for smaller details.
- Any illustration color may sit on black or white; on colored grounds keep the object in the same tonal range.
- Don't Unrelated illustration styles, replacing the evergreen logo pose with an expressive variant, or colorful objects competing with a colored ground.

Real examples, to look at on Reddit's own pages (not for reuse):
- Snoo as a dimensional character: https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Snoo illustrations
- Secondary viewing angles: https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Secondary angles
- Emotion through character parts: https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Expressions
- Unified topic-object vocabulary: https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Spot illustrations
- OrangeRed base, highlight and tint on an object: https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Color logic
- Illustration color paired with background: https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Color pairings

Sources: https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Spot illustrations, https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Snoo illustrations, https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Secondary angles, https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Expressions, https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Color logic, https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Color pairings, https://redditbrand.lingoapp.com/s/Illustration-R9r6q8 — Campaign-based customization

## Photography: rules

User images foreground eclectic people, objects and places; sourced photography supplements when higher definition is needed.

Why it works: Actual contributions convey Reddit’s communities and their lived interests.

|  |  |
|---|---|
| Mask extrusion | Overlaps 1–2 frame edges |
| Focal placement | Rule of thirds |
| Required resolution / image ratios | not published |

- Choose natural lighting, a clear subject, high quality, rich tone and neutral contrast.
- Show people with distinctive passions, objects that invite curiosity and places that transport the viewer.
- Translate traits into inviting/friendly, provocative/clever, playful/energized and honest/familiar imagery.
- Apply rule-of-thirds intersections to place focal subjects in any aspect ratio.
- Mask full-bleed imagery in bubble frames; focal cutouts may overlap one or two frame edges.
- Prefer high-definition stock imagery for cutout collages and user-generated imagery for bubble masking.
- Obtain the original poster’s permission before using UGC; partners are responsible for obtaining it.
- Don't Weak focal points, poor-quality cutouts, accidental-looking tiny overlaps, or so much extrusion that the frame becomes unrecognizable.

Real examples, to look at on Reddit's own pages (not for reuse):
- People, objects and places: https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Subject matter
- Traits translated into photographic tone: https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Tonal consistency
- Diverse content in bubble masks: https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Image masking
- Layered photographic treatment: https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Sourced vs UGC imagery

Sources: https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Establishing principles, https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Subject matter, https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Tonal consistency, https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Image masking, https://redditbrand.lingoapp.com/s/Photography-dpwXzv — Sourced vs UGC imagery

## Motion: rules

The bubble pops, expands and changes dimensions; elements enter with controlled spring-like momentum.

Why it works: Movement extends the modular, conversational identity instead of becoming a separate visual language.

|  |  |
|---|---|
| Timing / curves | Numeric durations, cubic-bezier values and spring constants not published |
| Motion evidence limit | Saved screenshots are static; GIFs can show some movement, but embedded video examples are not supplied as playable source files |

- Expand or contract the bubble to accommodate content.
- Activate typography, shapes and imagery with restricted directional motion or scaling and a spring-like arrival.
- Keep velocity and acceleration coherent with spring momentum.
- Sequence the same behaviors across open/end cards, CTAs, lower thirds, transitions and social stories.
- Don't Mechanical motion without spring-like momentum or movement unrelated to the bubble’s modular expansion.

Real examples, to look at on Reddit's own pages (not for reuse):
- Bubble at rest for expansion demonstration: https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Expansion
- Bubble activation reference: https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Activation
- Combined elements animation: https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Sequencing with combined elements
- Grid and branding in a bumper example: https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Bumper messaging

Sources: https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Elements, https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Expansion, https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Activation, https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Sequencing with combined elements, https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Bumper messaging, https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Velocity, https://redditbrand.lingoapp.com/s/Motion-principles-P049qM — Motion application examples

## Interface and layout: rules

A grid uses the bubble as a scale unit; content and negative space align to shared subdivisions.

Why it works: One modular system stabilizes varied dimensions and media.

|  |  |
|---|---|
| Foundation | 12 × 12 |
| Subdivisions | 12×12, 6×6, 4×4, 3×3, 2×2, 1×1 |
| Pixel gutters / margins / breakpoints | not published |

- Begin with a 12×12 foundation and choose appropriate 12×12, 6×6, 4×4, 3×3, 2×2 or 1×1 subdivisions.
- Use grid cells to scale and extend content blocks.
- Align negative space as deliberately as type, images and logos.
- Use the bubble as the basic scale unit, preserving consistent corner geometry.
- Don't Arbitrary off-grid placement, inconsistent scaling, crowded negative space or distortion of the bubble geometry.

Real examples, to look at on Reddit's own pages (not for reuse):
- Landscape and portrait grid foundations: https://redditbrand.lingoapp.com/s/Composition-d2z06e — Establishing the grid
- Grid construction animation: https://redditbrand.lingoapp.com/s/Composition-d2z06e — Building the composition
- Grid-aligned scale: https://redditbrand.lingoapp.com/s/Composition-d2z06e — Consistent scaling
- Negative space and content blocks: https://redditbrand.lingoapp.com/s/Composition-d2z06e — Space

Sources: https://redditbrand.lingoapp.com/s/Composition-d2z06e — Building the composition, https://redditbrand.lingoapp.com/s/Composition-d2z06e — Establishing the grid, https://redditbrand.lingoapp.com/s/Composition-d2z06e — Consistent scaling, https://redditbrand.lingoapp.com/s/Composition-d2z06e — Space

## Rules: rules

Shared posts and comments retain context, attribution and community identity through official templates.

Why it works: A consistent presentation helps people recognize Reddit and respects contributors.

|  |  |
|---|---|
| Template resource | Reddit_DisplayingContent_Template |
| Licensing contact | licensing@reddit.com |

- Obtain explicit original-poster permission for content reuse.
- Use official content templates for posts and comments.
- Always credit a post’s community and preserve its display case; poster credit is optional but encouraged.
- For comments include community and parent-post title above the comment, using ellipses for a truncated title.
- Comment usernames are required; usernames and community names may be partly obscured using bullet characters.
- For broadcast posts, votes, comment counts and date are optional.
- Commercial brand assets are for Reddit and licensed partners, and are subject to Reddit review and revocable approval.
- Do not associate assets with policy violations, controlled substances, weapons, offensive material or defamatory uses.
- Personal custom Snoos must identify the individual/community relationship and cannot imply Reddit sponsorship. Never detach a custom Snoo head from its body.
- Don't Uncredited communities, missing comment usernames/context, implied official status, or unauthorized commercial asset use.

Real examples, to look at on Reddit's own pages (not for reuse):
- Light-mode official post/comment template set: https://redditbrand.lingoapp.com/s/Displaying-content-oEzE97 — Displaying content
- Thumbnail preview of the light template set: https://redditbrand.lingoapp.com/s/Displaying-content-oEzE97 — Reddit posts
- Dark-mode official post/comment template set: https://redditbrand.lingoapp.com/s/Displaying-content-oEzE97 — Reddit comments

Sources: https://redditbrand.lingoapp.com/s/Displaying-content-oEzE97 — Reddit posts, https://redditbrand.lingoapp.com/s/Reddit-rules-RM7NAw — Default rules, https://redditbrand.lingoapp.com/s/Reddit-rules-RM7NAw — Partner rules, https://redditbrand.lingoapp.com/s/Snoo-dGekEY — Custom Snoos, https://redditinc.com/brand — Licensing the Reddit brand, https://redditbrand.lingoapp.com/s/Displaying-content-oEzE97 — Displaying content, https://redditbrand.lingoapp.com/s/Displaying-content-oEzE97 — Reddit comments

## Campaigns

### Seasonal campaign gradients

Seasonal palette extensions, rather than a documented individual campaign.

How the system shows: Mango, Dragonfruit, Cantaloupe and Honeydew combine published colors and tints while retaining the bubble system.
Why it works: New tonal combinations offer campaign variety without replacing the underlying identity.
Channels: Seasonal campaigns, Events, Partnerships. Source: https://redditbrand.lingoapp.com/s/Color-R7y72J — Tertiary gradients

## Applications

| Format | What | Source |
|---|---|---|
| Public brand overview page | OrangeRed hero and Snoo; alternating white and OrangeRed sections, a LimeGreen type showcase and bubble-shaped resource cards. | https://redditinc.com/brand |

## By format

Format levels are an extraction interpretation using the handoff’s 0–5 loudness scale; no official Reddit tiers are published. Requirements paraphrase the cited chapters. Website anatomy is deferred. Loudness runs 0 (nothing but the essentials) to 5 (the signature moves at full volume).

| Format | Loudness 0–5 | Must appear | What varies |
|---|---|---|---|
| Landing page | 3 | Approved logo, visible OrangeRed for brand speech, clear hierarchy, readable type, bubble geometry and contextual imagery. | Primary brand or secondary community emphasis; cutouts, Snoo and motion when useful. |
| Social post / story | 3 | Approved share assets, consistent bubble radii, legible contrast and attribution for reused content. | Staggered headlines, layered imagery, community tonal palette and spring entrances. |
| Campaign / partnership | 3 | Agreed partner lockup and optical balance; OrangeRed approval for gradients or customized Snoo. | Approved seasonal gradients, licensed character customizations and expressive framing. |
| Presentation / business deck | 2 | Clear left-aligned copy, limited type sizes and grid alignment. | Condensed only when high character count and limited space justify it; Mono business headlines. |
| Editorial / broadcast content | 2 | Poster permission, official templates, community credit; comments need username and parent context. | Broadcast votes, comment counts and post date are optional. |
| Community branding / event / merchandise | 2 | Pill community lockup by default; icon for more than 15 characters or OrangeRed ground. | Community color family and approved community/person-specific assets. |
| Product / constrained UI | 1 | Accessible Sans, functional contrast, approved in-product color roles; consult Design Systems. | Condensed for constrained high character count; tertiary status tints and neutral modes. |
| Code / data | 1 | Reddit Mono for code and monospaced numerals. | Case-specific creative or Business Marketing applications. |
| Sensitive communication | 0 | Simple honest help with clear context and respectful language. | Remove playful tone when the surrounding topic is sensitive. |

## Checks before anything ships

- **Logo hidden**: Without the logo, the circle-derived bottom-tail bubble, OrangeRed, heavy warm headline, dimensional Snoo or topic object, and candid community content should still identify Reddit.
- **Speaker check**: Is Reddit speaking, or are redditors speaking? Choose primary brand colors for the former and a secondary tonal family for the latter.
- **Bubble check**: Are radii consistent, tails at the bottom, layers connected and padding tied to radius?

## Make it your own

Keep the system: color roles and proportions, type, layout, components, the signature moves, the voice traits and rules. Replace everything that is Reddit's own: name and logo, positioning, pillars, proof, taglines, boilerplate and any real line quoted above. kit.json lists these under make_it_yours.

## Not published

- Numeric color area proportions: not published. The guide only prioritizes primary colors for Reddit speech and tonal secondaries for community speech.
- Semantic surface, muted-text and secondary-accent token assignments: not published; kit palette aliases are provisional extraction mappings.
- Logo minimum screen and print reproduction sizes: not published. SVG export dimensions listed on the portal are asset sizes, not minimum sizes.
- Pixel layout margins, gutters, spacing scale and responsive breakpoints: not published; only the 12×12 foundation and subdivisions are specified.
- Absolute bubble radii, frame pixel dimensions and general aspect ratios: not published. Radius-relative construction is published.
- Type pixel-size hierarchy: not published; 2–3 sizes per composition, Display 1:1 leading and optional Sans 1.25 leading are specified.
- Reddit Display and Reddit Sans Chocolate public font files and open licences: not supplied. Both are real proprietary faces; Reddit Sans substitutes here are provisional and await anatomy calibration.
- Button height, padding, radius, border and interaction states: not published; rounded CTAs are visible on redditinc.com/brand.
- UI icon grid, sizes and stroke specification: not published. Sharing icons and 3D spot objects are documented.
- Motion durations, easing curves, spring constants, delays and reduced-motion guidance: not published.
- Embedded motion video demonstrations are not available as playable files in the supplied capture. Static screenshots cannot establish their exact timing or sequencing.
- Gradient stop percentages, interpolation and numerical angles: not published; named endpoint/intermediate hex values are printed in the source image.
- Illustration rendering material, lighting and camera parameters: not published.
- Photography minimum resolution, licensing scope for each pictured contribution and individual UGC permissions: not published in the supplied sections.
- Named messaging pillars, quantitative audience/performance proof, competitive ranking and formal long boilerplate: not published. Pillars and boilerplate are explicitly paraphrased synthesis.
- Detailed Language kit, avatar guidelines, illustration/UGC libraries and production template contents: linked but not included in the supplied section corpus.
- The vertical-layer usage list calls portrait formats extra wide; this is an internal wording inconsistency. The examples and chapter title indicate vertical stacking.
- Public brand page and portal use some older asset/description wording; this extraction prioritizes Brand System v5.1 construction and records redditinc.com/brand as corroborating public presentation.
- Several viewport examples show loading failures. Native source images recover voice audience samples and content templates; embedded motion-video demonstrations remain incompletely represented. Native GIF frames were reviewed without deriving unpublished timing values.

Logos and reference images belong to Reddit. Look at them on Reddit's own pages; don't reuse them.