# Blender: brand book and build spec

A free-software brand in two layers: a fixed orange-and-blue logo (PMS 716 #E87D0D, PMS 647 #265787) protected by clear trademark rules, and a quiet slate-grey web system (Inter, #4C4D52 on #F2F2F3, #0099FF links) whose color comes from credited art made in Blender. The voice is warm, plain and about freedom.

From unfairly.ai/brand-guidelines/blender, checked 2026-10-30. Unofficial study; not affiliated with Blender.

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):** The art is the brand. blender.org is a neutral, rounded, Inter-set frame so that what people make in Blender, credited by name, carries the color and the emotion; the orange-blue logo is the one fixed mark. Based on: Web Assets defines only neutral greys and a blue UI accent; every hero is a credited render; the logo colors are absent from the UI; the homepage pillars are freedom, industry, people and ecosystem.

## Purpose

Mission: Get the world's best 3D CG technology in the hands of artists as free/open source software. (published; https://www.blender.org/about/)

Story: The Blender Foundation (2002) is an independent public-benefit organization in Amsterdam that runs blender.org as a public project. Its main income is the Development Fund plus one-time donations; Blender Institute employs developers and Blender Studio makes open films and training that push the software. Since 2020 it publishes annual reports on activities and finances. In January 2026 Ton Roosendaal handed the chairman and CEO roles to Francesco Siddi. (observed)

| Value | What it means in the work | Source |
|---|---|---|
| Free software | Use Blender for any purpose, distribute it, study and change it, distribute changed versions (the four GPL freedoms, paraphrase). | published: https://www.blender.org/about/license/ |
| Your work is yours | What you create with Blender is your sole property, free to use as you like (paraphrase). | published: https://www.blender.org/about/license/ |
| Community first | Work, projects and roadmaps are managed in open channels on blender.org (paraphrase). | published: https://www.blender.org/about/foundation/ |
| Transparency | Annual reports on activities and finances since 2020 (paraphrase). | published: https://www.blender.org/about/foundation/ |
| Privacy | No third-party tracking or ads on blender.org; no registration or internet needed to use Blender (paraphrase). | published: https://www.blender.org/about/website/ |

## Fixed and flexible

Never changes:
- The complete orange-and-blue logo, unaltered
- Inter everywhere
- Neutral slate UI: #F2F2F3, #FAFAFA, #4C4D52, #292D32
- Credited art made in Blender as the imagery
- Freedom and Free and Open Source as the message

The one thing that varies: The hero art and the homepage box colors change; the frame does not. The guide sets no level for color; blender.org runs from plain grey info pages to saturated massive-title boxes on the homepage.

## Positioning

- **Statement**: The Free and Open Source 3D Creation Suite. (observed)
- **Category**: Free and open source 3D creation software (page title: 'The Free and Open Source 3D Creation Software') (observed)
- **Audience**: Artists first, plus studios making animation and VFX, game artists, scientists, students and educators; individual artists and small teams get a complete pipeline (paraphrase). (published)
- **Problem**: Commercial 3D tools lock work behind trial or educational editions that forbid commercial use (paraphrase of the license page's contrast). (our reading)
- **Promise**: The freedom to create: the whole 3D pipeline, free forever, and the work belongs to you. (our reading)
- **Differentiators**: GNU GPL, owned by its contributors; nobody can take the freedom away.; Community project funded by donations and the Development Fund, not by license sales.; A complete pipeline in one suite: modeling, sculpting, rendering, VFX, animation and 2D in 3D.; Member of the industry's open-source and standards bodies; supported by AMD, Apple, Intel, NVIDIA and Qualcomm.; Privacy: no registration, works offline, no tracking on blender.org.
- **Alternatives**: Trial or 'educational' versions of commercial software that forbid commercial work.

## Messaging

Boilerplate (observed): Blender is the free and open source 3D creation suite: a community project coordinated by the Blender Foundation, primarily funded by donations. Thousands of people have contributed to the software and millions use it daily. It is released under the GNU GPL, so anyone may use it for any purpose, including commercially, and everything made with it belongs to its creator.

Taglines:
- The Freedom to Create (About page hero; homepage closing line before Download Blender)
- Artistic freedom starts with Blender (Footer note on every blender.org page)
- The Free and Open Source 3D Creation Suite (Footer note on every blender.org page)
- Free to Use. Free to Change. Free to Share. Free to Sell Your Work. (License page hero subtitle)

| Pillar | Claim | Proof | Label |
|---|---|---|---|
| Free and Open Source | A public project, licensed GNU GPL and owned by its contributors, free forever. | Licensed GNU GPL (v2 or later for source; binaries under v3 or later); Cycles is Apache 2.0.; Over 20 million downloads per year (website credits page). | observed |
| Part of the industry | A member of the industry's open-standards bodies and backed by the major hardware vendors. | Member of the Academy Software Foundation, Khronos Group (Associate), Linux Foundation and Open Invention Network; also ASIFA Hollywood.; Development Fund Corporate Patrons announced in press releases include Netflix Animation Studios (Jan 2026), Wacom and Bolt Graphics (2025). | observed |
| It's about people | Designers, developers, engineers and artists, all driven by passion. | Thousands of contributors; millions use it daily (about page wording, no exact count). | observed |
| The Ecosystem | Communities, tutorial makers, add-on developers and marketplaces built around Blender. | Blender-based businesses that thrive within the trademark policy: Superhive, CGCookie, Creative Shrimp (named by the policy). | observed |
| Everything You Need | Rendering, modeling, VFX, animation, 2D-in-3D and a Python-customizable interface in one suite. | Cycles, Blender's built-in unbiased path-tracer, with CPU and GPU rendering. | observed |

Real lines, as they wrote them:
| Line | Channel | Source |
|---|---|---|
| "The Freedom to Create." | homepage closing CTA | https://www.blender.org/ (2026-10-30) |
| "Free and Open Source" | homepage section | https://www.blender.org/ (2026-10-30) |
| "Part of the industry" | homepage section | https://www.blender.org/ (2026-10-30) |
| "It's about people." | homepage section | https://www.blender.org/ (2026-10-30) |
| "Everything You Need" | homepage section | https://www.blender.org/ (2026-10-30) |
| "Make it Your Own" | homepage feature | https://www.blender.org/ (2026-10-30) |
| "Blender is Free Software" | license page hero | https://www.blender.org/about/license/ (2026-10-30) |

## Voice

Tone words: Free, Community-minded, Enthusiastic, Plainspoken.

Traits:
- Free, but not Freemium (our reading)
- Community-owned, but not Corporate (our reading)
- Generous, but not Litigious (our reading)
- Artist-first, but not Self-promoting (our reading)
- Transparent, but not Opaque (our reading)
- Enthusiastic, but not Salesy (our reading)

- Plainspoken means concrete, not simple: Blender talks to practitioners in the names of real tools and techniques, then adds a little warmth ('Really!'). Vague benefit copy is off-voice.
- Blender publishes no voice or copy guide. Everything here is read from its own pages (observed 2026-10-30), not prescribed.
- Freedom is the through-line: free to use, change, share and sell your work; 'Free and Open Source software, forever.'
- Credit the people: the community, contributors and artists come before the software; hero art carries the artist's name.
- Warm and a little playful: exclamation marks and asides appear in Blender's own copy ('Really!', 'Hi Five!').
- Plain explanations, including of money: who pays, how funds are spent, annual reports.
- The trademark rules govern how others use the name: written out in full, never abbreviated or merged into another name.

Rules a copy check enforces:
- Product copy names the actual tool, technique or standard (path tracer, N-Gons, B-spline bones, planar tracking, OpenGL viewport, Python API). Never replace a feature with a benefit abstraction ('one file from start to finish', 'ready for anything'). Short noun-phrase list items, no verbs of promise.
- News and Studio excerpts name the real thing (a person, a technique such as NPR or Gaussian splatting, a phase such as fundraising) and may open with a lively verb phrase ('Buckle up', 'Let's take a stroll'). Never generic invitations ('Watch', 'Meet', 'Discover', 'The team shares').
- Title case headlines
- American spelling
- Exclamation marks are part of the voice in moderation: one in a line of enthusiasm, never in rules or legal copy
- Write the name as Blender: never abbreviated, modified or combined with other words or symbols into a new mark
- To say a work was made with Blender, type it out (e.g. 'made with Blender') rather than using the logo
- Describe Blender as Free and Open Source software (capitalised as Blender writes it), licensed GNU GPL
- Never: free trial, educational version, trial version
- Third-party copy must never imply official affiliation, sponsorship or endorsement by the Blender Foundation

Their words: free, open source, community, artists, create, freedom.
Never: free trial, educational version.

## Color

| Name | Hex | Role | Use |
|---|---|---|---|
| Background | #F2F2F3 | paper | Web Assets --color-bg: the page ground everywhere. |
| Background primary | #FAFAFA | surface | Box and card fill (--box-bg-color). |
| Text | #4C4D52 | ink | Headings and body on light grounds. |
| Text secondary | #8D8E96 | ink_muted | Muted text and navbar labels. |
| Blender Orange (PMS 716) | #E87D0D | accent | Logo color (published). Used here as the brand accent: our reading; blender.org itself keeps it in the logo and orange badge only. |
| Blender Blue (PMS 647) | #265787 | accent_secondary | Logo wordmark and eye (published). |
| Accent blue | #0099FF | extra | Web Assets --color-accent: links, focus, active tabs, tinted primary buttons. |
| Background tertiary | #E2E3E4 | border | Web Assets --border-color (bg - 6%). |
| Body / dark ground | #292D32 | night | Sub-nav, hero fallback, footer; white text on it. |
| White | #FFFFFF | on_night | Logo swatch; text on dark and over hero art. |
| Accent button gradient | #6183FF | extra | Start of the 350deg gradient to #47AAF5 on Donate. |
| Button ground | #EAEDF0 | extra | Default grey button. |
| Global navbar | #1C1E22 | extra | Global navbar; dark-theme ground. |
| Info background | #D9F5FC | extra | Announcement / info alert bar. |
| Massive-title teal | #46EBC2 | extra | Homepage box heading on #1C1C1C (observed). |
| Massive-title blue | #0066FF | extra | Homepage box heading on #F2F7FF (observed). |
| Massive-title purple | #9300FF | extra | Homepage box heading on #F8F2FF (observed). |

## Typography

| Role | Their face | Licence | Open stand-in (Google Fonts) | Fallback |
|---|---|---|---|---|
| display | Inter | Open (SIL OFL 1.1), copyright The Inter Project Authors; shipped in Blender Web Assets | Inter | Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif |
| body | Inter | Open (SIL OFL 1.1) | Inter | Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif |
| mono | ui-monospace | System fonts; no brand mono shipped | Source Code Pro | ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Source Code Pro", "Fira Mono", monospace |

| Role | Token | Face | Desktop | Phone | Line height | Tracking | Weight |
|---|---|---|---|---|---|---|---|
| Font loading (read first) | --text-loading-* | Inter | 18px | 14px | 1.556 | 0px | 400 |
| Hero H1 | --text-hero-* | Inter | 72px | 36px | 1 | 0px | 800 |
| Massive title (boxes) | --text-massive-* | Inter | 72px | 50.64px | 1.3 | 0px | 800 |
| Features heading | --text-display-* | Inter | 72px | 28px | 1.556 | 0px | 800 |
| Feature title | --text-h1-* | Inter | 32px | 28px | 1.556 | 0px | 600 |
| Section label H2 | --text-h2-* | Inter | 28px | 24px | 1.143 | 0px | 600 |
| Hero subtitle | --text-lead-hero-* | Inter | 24px | 21px | 1.167 | 0px | 400 |
| Feature description | --text-lead-* | Inter | 24px | 21px | 1.556 | 0px | 400 |
| Card title | --text-title-* | Inter | 21px | 18px | 1.167 | 0px | 400 |
| Box paragraph | --text-medium-* | Inter | 20px | 20px | 1.556 | 0px | 400 |
| Body / excerpt | --text-body-* | Inter | 18px | 14px | 1.556 | 0px | 400 |
| Button label | --text-button-* | Inter | 18px | 14px | 1.778 | 0px | 500 |
| Alert link | --text-alert-* | Inter | 18px | 14px | 1.556 | 0px | 400 |
| Card kicker | --text-kicker-* | Inter | 14px | 12px | 1.556 | 0px | 600 |
| Nav link | --text-nav-* | Inter | 14px | 15px | 1.556 | 0px | 400 |
| Footer link / title | --text-footer-* | Inter | 14px | 12px | 1.714 | 0px | 400 |

## Layout

Measured on https://www.blender.org/about/logo/: blender.org's logo, trademark, about, foundation, license, website and press pages and homepage (text and HTML, fetched 2026-10-30), the Blender Web Assets v2.2.10 source (the official front-end framework for blender.org sites, read from projects.blender.org/infrastructure/web-assets) and the live bthree theme CSS; no PDF brand guide exists.

| Measure | Desktop (1440) | Phone (390) |
|---|---|---|
| Page margin | 151px | 16px |
| Section padding | 48px | 48px |
| Container max width | 1170px | full |
| Hero text width | max 800px | full |
| Grid columns | 4 | 1 |
| Gutter | 16px | 16px |
| Card gap | 16px | 16px |
| Navigation height | 64px | 64px |

Breakpoints from Blender's CSS: px.

Homepage bands, top to bottom (observed):
1. Survey alert
   - Desktop: 1440x48, 18px #10A2C6
   - Phone: 390x40, 14px
   - Scrolls away; not sticky
2. Navigation
   - Desktop: 64px, container 1170, links right-aligned 14px #4C4D52
   - Phone: 64px: logo left, hamburger right; menu drops down as #F2F2F3 rows
   - Sticky; #0099FF 6px dots on Roadmap and Jobs
3. Hero
   - Desktop: 640px, content bottom-left at x 175, H1 72px 800
   - Phone: 640px, H1 36px, buttons stacked
   - 25deg rgba(0,0,0,0.66)->0 gradient from lower left
   - Credit link bottom right at 50% opacity
   - Ground: full-bleed film art on #292D32
4. Latest News
   - Desktop: grid 2 x 561, gaps 16/24
   - Phone: 2 small cards side by side, report card full width
   - Uppercase 600 kickers above 21px titles
5. Blender Development
   - Desktop: 4 x 272.5, thumbnails 273x153
   - Phone: 1 column 358 wide
   - Thumbnails are text-on-image blog graphics
6. Blender Studio
   - Desktop: 4 x 272.5, 48px above the H2
   - Phone: 1 column
   - Same card as Development
7. Free and Open Source
   - Desktop: 1170x370, padding 48, radius 12
   - Phone: full-bleed 390x808
   - Title #46EBC2 72px 800
   - Ground is a rounded box (radius 12px) of this color inside the #F2F2F3 page, 48px padding
8. Part of the industry
   - Desktop: 1170x402
   - Phone: full-bleed, logos stacked
   - Title #0066FF
   - Ground is a rounded box (radius 12px) of this color inside the #F2F2F3 page, 48px padding
9. It's about people.
   - Desktop: 1170x692, cards 257x342
   - Phone: full-bleed, cards stacked 294x392
   - Title #9300FF
   - Ground is a rounded box (radius 12px) of this color inside the #F2F2F3 page, 48px padding
10. The Ecosystem
   - Desktop: 1170x480, radius 12
   - Phone: full-bleed 390x614
   - Text column 66%
   - Ground: photo collage + #020381->#2874FC gradient at 0.6
11. Everything You Need
   - Desktop: text 553 / image 664x373 bleeding to the edge, sides alternate
   - Phone: stacked, even images shifted off the left edge
   - "· " bullet lines at 24px
12. Freedom download row
   - Desktop: 79px, 50/50 columns meeting at the centre
   - Phone: tagline right, button left under it
   - Gradient button with strong 0.55 glow
13. Footer
   - Desktop: 453px, columns 195px, last 292px with 2px #454C54 left rule
   - Phone: 797px, 2-up columns, 12px text
   - No copyright or address line

## Page anatomy

How Blender's own landing pages are built, part by part (observed; https://www.blender.org/, 2026-10-30). A homepage pattern, not a brand law: follow it for landing pages.

**Announcement bar**
- summary: Full-width survey alert above the nav: one centred underlined link line on a pale cyan bar. It is the only bar above the nav (there is no separate dark utility bar at rest; the #292D32 strip at the top of ref/home-desk-full.png is the body ground showing through a capture artefact).
- text: Join the official Blender Survey 2026! followed by an orange heart emoji; "official Blender Survey 2026" is bold (600)
- href: https://www.blender.org/news/blender-survey-2026/
- ground: #D9F5FC (Web Assets alert-info), no border, no radius
- desktop: y 0-48, 1440 wide, padding 10px; text 18px/28px Inter 400 #10A2C6 with a 2px underline in the same color, centred (link x 545-896)
- phone: y 0-40, padding 10px; 14px/20px, one centred line (x 59-332)
- resting state: Always visible at load; not dismissible; scrolls away (not sticky)

**Navigation**
- summary: White 64px bar under the alert: complete Blender logo at the left of the 1170 container, a right-aligned row of seven plain text links and a blue gradient Donate button at the far right. Phone: logo left, hamburger right.
- ground: #FFFFFF with box-shadow 0 1px 2px rgba(0,0,0,0.05) at rest; when stuck to the top after scrolling the shadow becomes 0 0 24px rgba(0,0,0,0.2) (desktop)
- height: 64px desktop (y 48-112), 64px phone (y 40-104, padding 8px)
- border: none; separation is the 1px/2px shadow only
- logo: variant complete horizontal logo (orange orbit + blue eye + lowercase blender wordmark + registered mark), full colour, no white socket, served as an SVG CSS background (background-size 100%, centred); px 128px wide box, logo drawn about 128x37 (SVG viewBox 198x58), vertically centred in the 64px bar; position desktop x 151 (container 1170 at x 135 + 16px padding); phone x 8 in a 128x48 box; colors nav SVG fills #F4792B orange, #0E548B blue, #FEFEFE white (these are the served values; the published logo is #E87D0D / #265787); hover opacity 0.8; file nav-logo-blender.svg (the logo the theme serves; SVG embedded in style.css)
- links: count 8; labels Roadmap,Download,Support,Get Involved,About,Jobs,Store,Donate; hrefs /roadmap/,/download/,/support/,/get-involved/,/about/,/jobs/,https://store.blender.org/,https://fund.blender.org/; size 14px; weight 400; color #4C4D52; hover #0099FF (no underline); alignment right-aligned group: Roadmap x 678, Download 756, Support 838, Get Involved 907, About 1006, Jobs 1062, Store 1110 (each padding 0 8px, full 64px tall); Donate button x 1185; highlight dots Roadmap and Jobs carry a 6px #0099FF dot (::after, absolute, top 16px, right 4px) above the end of the label; dropdowns none
- actions: ['Donate: .btn-accent, 104x32 at x 1185 y 64; linear-gradient(350deg, #6183FF, #47AAF5); white 14px/32px Inter 500 label after a heart outline icon; radius 6px; padding 4px 16px; glow 2px 4px 4px rgba(0,82,255,0.1), 1px 16px 24px rgba(0,82,255,0.1), 2px 8px 32px rgba(0,82,255,0.3); hover gradient #708FFF to #5AB3F6'] | Donate box: height fixed 32px (height: 32px; line-height 24px; padding 4px 16px), 104 wide, 14px 500 white
- sticky: position sticky, top 0: the alert scrolls away and the nav sticks
- phone: {'shows': 'logo (128x48 box at x 8) and a 53x48 hamburger button at x 329 (fontutti i-menu glyph, 15px #4C4D52, transparent ground, radius 6px); no Donate in the bar', 'menu': 'drops down under the bar (not a full sheet): eight full-width rows Roadmap ... Store, then a heart + Donate row; each row 51px, 15px/400 #4C4D52, padding 16px, #F2F2F3 ground, separated by 2px rules; Roadmap and Jobs keep the #0099FF dot at the right edge; the rest of the screen below is #292D32', 'cta': 'none in the bar; Donate only inside the menu'} | the 15px size applies only to the rows of the opened phone menu; the closed bar shows logo + hamburger only

**Hero**
- summary: Full-bleed 640px art hero: a Blender Studio film splash (OVERGROWN) as a cover background with a 25deg dark gradient from the lower left, and a bottom-left stack of a heavy white release headline, a 24px subtitle and two buttons; a small "Blender Studio" credit link bottom right. Copy verbatim: headline 'Blender 5.3 Beta'; subtitle 'NVIDIA RTX Spark-ready with support for DLSS denoising, Gaussian Splatting, and much more!'
- desktop: band y 112-752, 1440x640, ground #292D32 under the image; content box container 1170 (x 135) with 16px padding; .hero-content x 151 w 1138, anchored to the bottom with 48px bottom margin (content y 496-704); headline x 175 (24px inset inside the content box), y 496, 72px/72px, ink width about 583px for "Blender 5.3 Beta"; subtitle y 576, box max-width 800px with text-wrap: balance, 24px/28px: the line breaks are balanced, giving 2 lines of ~536 and ~531px. Use text-wrap: balance, not a hard break; buttons row at y 648, 40px tall, 9px gap: What's Coming 226x40 at x 175, Download & Test 175x40 at x 410; text max width 800; media frame none: image is full-bleed edge to edge, no radius, no overlap with the next band; credit Blender Studio, 14px underlined white link at opacity 0.5, text-shadow 0 0 16px rgba(0,0,0,0.66), x 1335 y 723 (8px from right and bottom)
- phone: band y 104-744, 390x640; background-position 80% 50% so the raccoon character stays in frame; order headline, subtitle, then the two buttons stacked (What's Coming wraps above Download & Test), all left-aligned at x 40; sizes headline 36px/36px 800 at y 419 (one line, 310 wide); subtitle 21px/28px, 4 lines, y 463-575; What's Coming 197x32 at y 607 (14px/24px 500, padding 4px 48px); Download & Test 143x32 at y 648 (14px/24px 400); credit 12px at x 299 y 718; subtitle also text-wrap: balance
- at rest: Static: no motion, no carousel. Image loaded, overlay linear-gradient(25deg, rgba(0,0,0,0.66) 10%, rgba(0,0,0,0) 65%), plus a .hero-overlay color of rgba(10,10,10,0) (transparent)
- media: src hero-splash-overgrown.webp: the OVERGROWN splash by Blender Studio, served by blender.org; size 2000x1000 webp; fit background-size cover, position 100% 50% desktop / 80% 50% phone
- type: Headline Inter 800 (font-variation-settings "wght" 800), 72px/72px desktop, 36px/36px phone, tracking normal, #FFFFFF, text-shadow 1px 1px 4px rgba(0,0,0,0.25) on all hero text; subtitle Inter 400 24px/28px (21px/28px phone) #FFFFFF
- cta:
  - What's Coming (primary on art): fill rgba(255,255,255,0.9), text #000000 18px/32px Inter 500, padding 4px 48px, radius 6px, no shadow; hover fill #FFFFFF
  - Download & Test (secondary on art): fill rgba(255,255,255,0.1), text #FFFFFF 18px/32px Inter 400, padding 4px 16px, radius 6px; hover fill rgba(255,255,255,0.2)
- proof: none in the hero (no logos, no stats)
- copy: headline Blender 5.3 Beta (the current release; use it as is); subtitle NVIDIA RTX Spark-ready with support for DLSS denoising, Gaussian Splatting, and much more!; cta What's Coming -> https://www.blender.org/download/releases/5-3/ ; Download & Test -> https://builder.blender.org/download/daily/; credit Blender Studio (links to the film); prov observed; source https://www.blender.org/ (2026-10-30)

**Latest News**
- summary: Section label plus a 2-up row of news cards and one full-width annual-report card below it.
- ground: #F2F2F3 (page ground; no band color change from here to the footer)
- desktop: #news container 1170 at x 135, padding 48px 16px (content x 151-1289); H2 at y 800; grid 2 x 561px with 16px column gap and 24px row gap; card 1 and 2 thumbnails 561x316 at y 848 (16:9); annual-report card spans both columns, thumbnail 1138x564 at y 1298 (about 2:1)
- phone: H2 24px/28px at y 792; the two news cards stay side by side (170 and 172 wide, thumbnails 96 tall, 16px gap); annual-report card full width 358x174 at y 1134
- anatomy:
  - H2 "Latest News" 28px/32px Inter 600 #4C4D52, margin-bottom 16px; the heading is a link to /news/ with no underline
  - Card = thumbnail link (radius 12px, shadow 0 8px 24px rgba(149,157,165,0.2), img object-fit cover, image also has 0 2px 4px rgba(0,0,0,0.05)) + 16px gap + uppercase kicker 14px/21.8px Inter 600 #4C4D52 + title 21px/24.5px Inter 400 #4C4D52 with padding 8px 0 16px
  - Kickers (verbatim structure): BLENDER SURVEY 2026, BLENDER CONFERENCE RECAP, REPORTS
  - Card hover: title turns #0099FF; thumbnail image scales to 1.033
  - No card background, border or padding: the text sits straight on #F2F2F3 (card-layout-card-transparent)
  - All card titles (news, Development, Studio, people cards) use text-wrap: balance, so 2-line titles split into even halves (e.g. 'Connecting / Blender Community', 'Showcasing Blender / at industry events', 'BCON26: Blender / Studio talks'). The hero subtitle also uses balance. Body paragraphs do not.
  - Card titles verbatim: 'Your participation will help shape the future of Blender.' (1 line) / 'Enjoy the recap of BCON26, which took place this September in Amsterdam.' (2 balanced lines) / report card: 'Blender Foundation Annual Report 2025'. Titles are full sentences with a full stop where the source has one
  - The fixed back-to-top circle (#hop, see page chrome) shows at the right edge once scrolled; build it
- components:
  - news_card

**Blender Development**
- summary: Section label linking to code.blender.org and four equal post cards with excerpts.
- ground: #F2F2F3
- desktop: section y 1980-2495, padding 30px 0; H2 at y 2010; 4 columns x 272.5px with 16px gaps at x 151, 440, 728, 1017; thumbnails 273x153 (16:9) at y 2058; title at y 2219; excerpt 18px/28px
- phone: single column, 358 wide; thumbnails 358x201; title 18px/20.6px; excerpt 14px/20px; about 346px pitch per card
- anatomy:
  - H2 "Blender Development" 28px/32px 600 #4C4D52 (links to code.blender.org)
  - Card: thumbnail (radius 12, same shadow), title 21px/24.5px 400 with margin-top 8px and padding 8px 0, excerpt 18px/28px 400 #4C4D52; no kicker
  - Thumbnails are the dev blog's own text-on-image graphics (GAUSSIAN SPLATS INITIAL SUPPORT RECAP etc.); use the files, never redraw
  - Titles/excerpts are links, open in a new tab
  - Excerpts: 18px/28px paragraphs, one or two sentences, 2-5 lines at 273px (the four cards measured 5, 5, 3, 2 lines); margin-bottom 16px. Titles 21px/24.5px, 1-3 lines
  - All card titles (news, Development, Studio, people cards) use text-wrap: balance, so 2-line titles split into even halves (e.g. 'Connecting / Blender Community', 'Showcasing Blender / at industry events', 'BCON26: Blender / Studio talks'). The hero subtitle also uses balance. Body paragraphs do not.
  - Card titles verbatim: Splatting the Gaussians into Blender / Geometry Nodes Workshop: September 2026 / Small Teams, Ambitious Projects / Geometry Nodes Physics. Excerpts are written by the developers, plain and specific: what was implemented and what's next, the workshop held after the conference, the strategic targets for the next two years, physics in 5.2 LTS. One ends in a truncation '[…]'
- components:
  - post_card

**Blender Studio**
- summary: Same 4-up post card row, pulling from studio.blender.org.
- ground: #F2F2F3
- desktop: H2 at y 2543 (48px top margin), grid y 2591-2957, 4 x 272.5px, thumbnails 273x153
- phone: single column, thumbnails 358x201, rows at y 2922, 3232, 3562, 3872
- anatomy:
  - H2 "Blender Studio" 28px/32px 600
  - Cards (titles verbatim): BCON26: Blender Studio talks / OVERGROWN: What’s next? / Announcing 'Cowboi' / OVERGROWN Teaser Premiere. Title 21px/24.5px, margin-top 8px, padding 8px 0, 2 lines (Cowboi 1 line). Excerpt 18px/28px #4C4D52, one sentence that wraps to 2-4 lines at 273px; the excerpt box is a block 140px tall (5 x 28px) on every card (165 where the title is 1 line), so the grid is 366px tall regardless of excerpt length
  - Identical card component to Blender Development
  - All card titles (news, Development, Studio, people cards) use text-wrap: balance, so 2-line titles split into even halves (e.g. 'Connecting / Blender Community', 'Showcasing Blender / at industry events', 'BCON26: Blender / Studio talks'). The hero subtitle also uses balance. Body paragraphs do not.
  - Studio excerpts are the film studio's voice: short, lively, insider. Verbatim where short: 'It’s time to learn new things from the creators who share!' / 'Let's take a stroll into the world of OVERGROWN.' The other two: one names the next steps after the community fundraising phase (Francesco speaking), one opens 'Buckle up' and mentions a director's debut and NPR techniques. Never 'Watch', 'Meet', 'The team shares'
- components:
  - post_card

**Free and Open Source box**
- summary: Near-black rounded box: teal massive title, two white paragraphs with an underlined Learn more link, and a cluster of teal heart hexagons at the right.
- ground: #1C1C1C box (radius 12px, padding 48px, shadow 0 2px 4px rgba(0,0,0,0.05)) on the #F2F2F3 page
- desktop: box x 135 w 1170, y 3053-3423 (48px top margin); text column 80% (x 183, 859 wide); hex image 134x192 at x 1123 y 3101, top-right
- phone: box full-bleed 390 wide (container margin 0) with radius 12px, y 4234-5042; title 50.64px/65.8px, 3 lines; image drops below the text, right-aligned at x 208
- anatomy:
  - Massive title "Free and Open Source" 72px/93.6px Inter 800 #46EBC2
  - Two 20px/31.1px Inter 400 #FFFFFF paragraphs; "Learn more" is a #FFFFFF underlined (2px) inline link
  - Image: teal heart hexagons PNG (Development Fund hex), 333x478 native, shown 134x192
  - Paragraph spacing: paragraph 1 (2 lines: public project, hosted on blender.org, GNU GPL, owned by its contributors) has margin-bottom 16px; paragraph 2 STARTS with a <br> (a blank 31px line) before 'For that reason Blender is Free and Open Source software, forever.' + underlined 'Learn more' link. So the visible gap between the paragraphs is 16 + 31 = 47px, about 62px baseline to top
- components:
  - massive_title_box

**Part of the industry box**
- summary: Pale blue box: blue massive title, one paragraph, and a row of four grey/colour member-organisation logos.
- ground: #F2F7FF box, radius 12px, padding 48px
- desktop: y 3471-3873; title y 3519; paragraph y 3629 (2 lines across 1074px); 4 equal logo columns, logos centred: Khronos 195x51, Linux Foundation 174x57, Open Invention Network 147x86, ASWF 129x69, row centred around y 3782
- phone: full-bleed box y 5090-5900; logos stacked one per row, centred at x 98-293, about 80-110px pitch
- anatomy:
  - Massive title "Part of the industry" 72px/93.6px 800 #0066FF
  - Paragraph 20px/31.1px 400 #4C4D52
  - Partner logos as supplied PNGs (no recolour, no filter), each a link to the organisation, radius 0
- components:
  - massive_title_box
  - logo_row

**It's about people box**
- summary: Pale purple box: purple massive title, one line of copy and four portrait photo cards with two-line titles.
- ground: #F8F2FF box, radius 12px, padding 48px
- desktop: y 3921-4613; title y 3969; line y 4079; 4 cards x 257px at x 183, 456, 728, 1001; thumbnails 257x342 (3:4 portrait) at y 4134; titles 21px/24.5px at y 4492
- phone: full-bleed box y 5948-8253; cards single column 294 wide, thumbnails 294x392
- anatomy:
  - Massive title "It's about people." (sentence case with full stop) 72px/93.6px 800 #9300FF
  - Line 20px/31.1px #4C4D52
  - Portrait cards: radius 12, shadow 0 8px 24px rgba(149,157,165,0.2), title only (no kicker, no excerpt)
  - Portrait thumbnails are exactly 257x342 (never shorter), object-fit cover; title below with padding 8px 0 16px, 2 lines at 21px/24.5px; card total 431px tall (342 + 16 gap + 73 title block)
  - Card titles verbatim, sentence case: Connecting Blender Community / Showcasing Blender at industry events / Creating Worlds at BCON19 / The demo scene is back with Nodevember
  - One line of copy under the title (20px/31.1px, 1 line at 1074px): three short fragments about designers, developers, engineers and artists driven by passion
  - All card titles (news, Development, Studio, people cards) use text-wrap: balance, so 2-line titles split into even halves (e.g. 'Connecting / Blender Community', 'Showcasing Blender / at industry events', 'BCON26: Blender / Studio talks'). The hero subtitle also uses balance. Body paragraphs do not.
- components:
  - massive_title_box
  - portrait_card

**The Ecosystem cover**
- summary: Rounded photo-collage cover (grid of community video stills) under a dark-to-bright blue gradient, with a white massive title, two paragraphs and an underlined link.
- ground: photo ecosystem-bcon20-todos.jpg (object-fit cover) + overlay linear-gradient(90deg, #020381, #2874FC) at opacity 0.6; radius 12px
- desktop: x 135 w 1170, y 4661-5141 (min-height 480px), padding 48px; text column 66% (709px) at x 183; title y 4736
- phone: full-bleed 390x614, y 8301-8915; title 50.64px 2 lines
- anatomy:
  - Layer order (bottom to top): the collage image (absolute, object-fit cover), THEN the gradient span ABOVE it (absolute inset 0, linear-gradient(90deg, #020381 0%, #2874FC 100%), opacity 0.6), THEN the text container (position relative). The blue wash must sit OVER the photo: if the photo shows natural skin tones the overlay is underneath; fix the stacking
  - Content is vertically centred in the 480px min-height cover (padding 48px): title at y 4736 (27px below the padding edge because of the centring)
  - Massive title 'The Ecosystem' 72px/93.6px 800 #FFFFFF, margin-bottom 16px
  - Then ONE paragraph, 20px/31.1px white, max 709px, built as: sentence 1 alone ('Countless communities and thriving businesses are built around Blender.'), then <br><br> (a blank line), then sentence 2 on tutorial makers, content creators, add-on developers and marketplaces forming an ever-expanding ecosystem (2 lines). Total 4 line-boxes: 1 + blank + 2 (y 4846-4970)
  - Then, as its own paragraph (margin-top 16px, y 4986), only the link 'Find Blender Communities' (white, underlined) to /community/
- components:
  - massive_title_box

**Everything You Need (features)**
- summary: A big plain heading then six alternating feature rows: text column and a 16:9 Blender UI screenshot that bleeds toward the page edge, swapping sides every row.
- ground: #F2F2F3, no box
- desktop: section y 5189-9154. Heading 'Everything You Need' at x 167 y 5205 (block 128px: 72px/112px, margin-top 16px, padding-bottom 16px). Six rows (li.feature-item), each padding 80px 0, rows touch (no gap). Row heights are FIXED by their content and must come out: 572, 706, 706, 594, 556, 631px (text column height + 160). Text column 553px wide (x 167 on odd rows, x 720 on even rows); image column 553px with the 664x373 image overflowing it by 48px outward (odd rows image x 713-1377; even rows image x 16-680), image vertically centred on the text column. Text column stack, top to bottom: title 32px/49.8px (one line, 50px box), then .feature-desc with padding 16px 0 16px; inside it the paragraph (24px/37.3px, max-width 537px, margin-bottom 16px), then the list (no margin; each item one 37.3px line unless it wraps; no gap between items). Row 1 ends with an extra empty 37px paragraph + 16px margin (an empty <p> after the list). Vertical: the heading block starts at y 5205 (16px below the section top 5189), row 1 starts at y 5361 directly under the 128px heading block +28px, and the section ends 28px below row 6 (y 9126 -> 9154). Rows 1-6 start at y 5361, 5933, 6639, 7345, 7938, 8495: hit these y values.
- phone: heading 28px/40px 800 at x 16. Rows padding 48px 0, stacked: title 28px/40px 600 at x 32 (w 326), then .feature-desc padding 18px 0 with paragraph and list inset to x 50, w 290 (21px/30px, paragraph margin-bottom 16px), then the image 326x183 with 20px margin above and below; odd rows image at x 32, even rows at x -64 (bleeds off the left, clipped). Row heights: 797, 921 for rows 1-2.
- anatomy:
  - Heading 'Everything You Need' 72px/112px Inter 800 (+synthetic bold) #4C4D52, a link to /features/, no box, no subtitle
  - Feature title: 32px/49.8px Inter 600 (+synthetic bold) #4C4D52. Gap title->paragraph = 16px (desc padding-top). Gap paragraph->list = 16px (paragraph margin-bottom). List items: no bullets, each item text starts with '· ' (middle dot, space), 24px/37.3px, zero item spacing
  - Both the paragraph AND the list are max-width 537px inside the 553px column (that is why exactly three items wrap: 'Edge slide, inset, grid and bridge fill, and more', '3D painting with textured brushes and masking', 'Python scripting for custom tools and add-ons', and in VFX 'Real-time preview of your tracked footage and 3D scene')
  - Line counts per row at 1440 (paragraph lines + list lines): row 1 Cycles Render Engine: 3 + 4 (+1 empty line); row 2 Modeling, Sculpt, UV: 3 + 9 (6 items, 3 wrap to 2 lines); row 3 VFX: 7 + 5 (4 items, 1 wraps); row 4 Animation & Rigging: 4 + 5; row 5 Story Art, Drawing 2D in 3D: 4 + 4; row 6 Make it Your Own: 5 + 5
  - List items verbatim (Blender's own feature names, technical and concrete): Cycles: Real-time viewport preview / CPU & GPU rendering / PBR shaders & HDR lighting support / VR rendering support. Modeling: Full N-Gon support / Edge slide, inset, grid and bridge fill, and more / Advanced sculpting tools and brushes / Multi-resolution and Dynamic subdivision / 3D painting with textured brushes and masking / Python scripting for custom tools and add-ons. VFX: Auto and Manual tracking / Powerful camera reconstruction / Real-time preview of your tracked footage and 3D scene / Support for Planar tracking and Tripod solvers. Animation & Rigging: Envelope, skeleton and automatic skinning / B-spline interpolated bones / Curve editor and dope sheets / Custom bone shapes for fast input / Sound synchronization. Story Art: Combine 2D with 3D right in the viewport / Full Animation Support with Onion Skinning / Layers & Colors for Stroke and Fill / Sculpt brush strokes & Parent to 3D objects. Make it Your Own: Customize the interface layout and colors / Hi-res/Retina screen support / Create your own tools and add-ons / Draw over the OpenGL viewport / Connect with Blender's Render API
  - Paragraphs (write your own, at the line counts above, in the same register): row 1 names Cycles as a built-in unbiased path tracer with ultra-realistic rendering; row 2 says the modeling tools make creating and editing models easy; row 3 opens 'VFX professionals say:' then the quote 'Probably the best tracker in the market' in curly quotes (the site names no person; keep it unattributed) then describes camera and object tracking, masking and live camera movement in the 3D scene; row 4 says the rigging and animation tools are used for short films, ads, TV series and features; row 5 opens with 'Really!' and argues drawing in a 3D viewport frees storyboarders and 2D artists; row 6 says the interface is Python-controlled (layout, colors, size, fonts) and extendable with add-ons
  - No divider rules between rows (the theme's orange ::before rule renders 0px tall)
  - Images are real Blender interface screenshots, radius 12px, no shadow
- components:
  - feature_row

**Freedom download row**
- summary: One centred line: right-aligned tagline beside the gradient Download Blender button.
- ground: #F2F2F3
- desktop: y 9154-9233; two 50% columns: "The Freedom to Create." 20px/31.1px #4C4D52 right-aligned ending at x 702 (padding 24px 0); button 253x40 at x 738 y 9173
- phone: tagline right-aligned full width at y 14415; button 218x32 left-aligned at x 0 y 14520 (14px) | The Download Blender button really sits flush at x 0 on phone (its column has no padding), 218x32; keep it there, centred vertically in a 77px row under the right-aligned line 'The Freedom to Create.' (padding 24px 0)
- anatomy:
  - Download Blender: .btn-accent px-5, padding 4px 48px, 18px/32px 500 white, gradient #6183FF to #47AAF5, glow 2px 4px 4px rgba(0,82,255,0.1), 1px 8px 24px rgba(0,82,255,0.1), 2px 8px 48px rgba(0,82,255,0.55)
- components:
  - button_accent

**Footer**
- summary: Dark #292D32 sitemap: four link columns (each with stacked groups), a fifth wider column split off by a 2px vertical rule holding social icons and the Donate block, and one centred note line.
- ground: #292D32 from y 9233 to the page end 9686; first group titles 79px below its top
- anatomy:
  - container 1170 at x 135; row of col-md-2 columns 195px wide at x 136, 331, 525, 720 (15px padding), then col-md-3 292px at x 915 with border-left 2px solid #454C54
  - Vertical rhythm: the footer ground starts at y 9233 and the first group titles sit at y 9312, 79px below the ground's top (footer padding-top 48px plus 31px row offset). Use 79px; this replaces any other padding figure.
  - Group spacing is TIGHT: group title (14px/24px 600, 24px tall) sits directly on its list; the list has margin-bottom 8px; the next group title starts right after (e.g. column 1: About at y 9312, its 8 links 9336-9528, Organization at y 9536, People/Jobs 9560-9608, Blender Network at y 9616). No other gap between groups; never 24px
  - Group titles 14px/24px Inter 600 #ABB2BA (most are links); links 14px/24px 400 #737E8C, no bullets, hover underline (color unchanged)
  - Columns verbatim: [{"column": 1, "groups": [{"title": "About", "href": "/about/", "links": ["Blender Foundation", "Blender Institute", "Blender Studio", "License", "Logo & Trademark", "Credits", "Privacy Policy", "Code of Conduct"]}, {"title": "Organization", "href": "none (plain label)", "links": ["People", "Jobs"]}, {"title": "Blender Network", "href": "https://network.blender.org/", "links": []}]}, {"column": 2, "groups": [{"title": "Download", "href": "/download/", "links": ["Latest Blender", "Blender LTS", "Previous Versions", "Experimental Builds", "Source Code", "Requirements", "Benchmark", "Flamenco"]}, {"title": "Extensions", "href": "https://extensions.blender.org/", "links": ["Add-ons", "Themes"]}]}, {"column": 3, "groups": [{"title": "Developers", "href": "https://developer.blender.org/", "links": ["Get Started", "Roadmap", "Projects", "Docs", "Blog", "Forum", "YouTube", "Python API"]}, {"title": "Blender Studio", "href": "https://studio.blender.org/", "links": ["Films", "Training", "Tools & Pipeline"]}]}, {"column": 4, "groups": [{"title": "Support", "href": "/support/", "links": ["Manual", "Community", "FAQ"]}, {"title": "Get Involved", "href": "/get-involved/", "links": ["Documentation", "Education"]}, {"title": "News", "href": "/news/", "links": ["Press Releases", "User Stories"]}, {"title": "Blender Conference", "href": "https://conference.blender.org/", "links": []}]}, {"column": 5, "groups": [{"title": "Follow Blender", "href": "https://bsky.app/profile/blender.org", "links": ["YouTube", "PeerTube", "Bluesky", "Instagram", "Facebook", "LinkedIn", "Mastodon", "TikTok", "Bilibili"], "note": "icon-only links (fontutti icons, 20px, #737E8C, 32px pitch; 8 on row one, Bilibili wraps to row two at 1440)"}, {"title": "Support Blender", "href": "https://fund.blender.org/", "links": ["Donate (gradient button with heart)", "One-time Donation"]}]}]
  - Social row: 20px fontutti icons, #737E8C, 32px pitch from x 932 at y 9344
  - Support Blender: Donate .btn-accent 260x40 at x 932 y 9456 (14px/32px 500, heart icon, glow 2px 2px 2px / 0.5px 4px 16px / 2px 4px 24px rgba(0,82,255) at 0.1/0.1/0.55), then "One-time Donation" 14px #737E8C centred under it
  - Footer note (y 9656, 30px): "Artistic freedom starts with Blender", a heart icon, "The Free and Open Source 3D Creation Suite"; 14px/21.8px #737E8C centred
  - No copyright line, no postal address and no phone number anywhere in the footer (verified in the HTML); legal entity is Stichting Blender Foundation (book identity), not printed here
  - Back-to-top (#hop): fixed round #FAFAFA button bottom-right with 0 8px 16px rgba(0,0,0,0.1) shadow; opacity 0 at rest, appears on scroll (animation only)
  - Back-to-top: a fixed 32px white circle with an up-chevron, right 24 bottom 24, shadow 0 8px 16px rgba(0,0,0,0.1). Build it; the screenshots show it.
- phone: y 14576-15373; columns become 2-up (194px each, 12px/17.1px text): About | Download, Developers | Support, then the social/Donate column (no rule) with icons at 32px pitch and a 164x32 Donate; note 12px centred on 2 lines (42px)

**On dark grounds**
- secondary button: On art: rgba(255,255,255,0.1) fill, #FFFFFF text, radius 6px (hero Download & Test). On #292D32 the only button is the gradient Donate.
- link: #FFFFFF with 2px underline (dark box, Ecosystem cover); footer links #737E8C, underline on hover
- muted text hex: #737E8C
- heading text hex: #ABB2BA
- hairline hex: #454C54
- logo variant: The site never places the logo on dark; when one is needed use the published one-colour white logo (study.logos) per the guide

## Components

- **button accent** (observed): fill #47AAF5, text #FFFFFF, radius 6, padding 4px 16px (4px 48px when px-5), height 40, text style 18px/32px Inter 500 (14px in nav and footer), shadow 2px 4px 4px rgba(0,82,255,0.1), 1px 8px 24px rgba(0,82,255,0.1), 2px 8px 48px rgba(0,82,255,0.55) (Download Blender); nav Donate 0.3 at 2px 8px 32px, example Download Blender (253x40), Donate (nav 104x32, footer 260x40), icon heart outline before Donate (fontutti i-heart), font size 18, weight 500, face body, padding x 16, fill css linear-gradient(350deg, #6183FF, #47AAF5). Real fill: background-image linear-gradient(350deg, #6183FF, #47AAF5) over #EAEDF0.
  - hover (observed): fill linear-gradient(350deg, #708FFF, #5AB3F6)
  - active (published): transform scale(0.95)
- **button on art primary** (observed): fill rgba(255,255,255,0.9), text #000000, radius 6, padding 4px 48px, height 40, text style 18px/32px Inter 500 (14px/24px phone, 32 tall), shadow none, example What's Coming (226x40), font size 18, weight 500, face body, padding x 48
  - hover (observed): fill #FFFFFF
- **button on art secondary** (observed): fill rgba(255,255,255,0.1), text #FFFFFF, radius 6, padding 4px 16px, height 40, text style 18px/32px Inter 400, example Download & Test (175x40), font size 18, weight 400, face body, padding x 16
  - hover (observed): fill rgba(255,255,255,0.2)
- **news card** (observed): thumbnail radius 12px, shadow 0 8px 24px rgba(149,157,165,0.2), 16:9 (2:1 for the full-width report card), object-fit cover, 16px below, kicker 14px/21.8px 600 UPPERCASE #4C4D52, title 21px/24.5px 400 #4C4D52, padding 8px 0 16px; text-wrap: balance, fill none
  - hover (observed): title #0099FF, image transform scale(1.033)
- **post card** (observed): thumbnail 273x153 desktop, radius 12, same shadow, title 21px/24.5px 400, margin-top 8px, padding 8px 0; text-wrap: balance, excerpt 18px/28px 400 #4C4D52 (14px/20px phone)
- **portrait card** (observed): thumbnail 3:4 portrait 257x342, radius 12, same shadow, title 21px/24.5px 400, 2 lines; text-wrap: balance
- **massive title box** (observed): radius 12, padding 48, shadow 0 2px 4px rgba(0,0,0,0.05), grounds #1C1C1C (title #46EBC2, body #FFFFFF), #F2F7FF (title #0066FF), #F8F2FF (title #9300FF), photo + gradient (title #FFFFFF), title 72px/93.6px Inter 800, body 20px/31.1px 400, gap 48px between boxes
- **feature row** (observed): layout flex, space-between, align centre; padding 80px 0; text 553 / image 664x373 radius 12 with no shadow; image side alternates (row-reverse on even rows) and bleeds 48px right or 96px left, bullets plain text lines prefixed "· "
- **nav link** (observed): text style 14px Inter 400 #4C4D52, padding 0 8px, 64px tall, dot 6px #0099FF circle top 16px right 4px (is-highlight)
  - hover (observed): color #0099FF
- **text link on dark** (observed): text #FFFFFF, decoration underline 2px

## Motion tokens

| Name | Easing | Duration | Use | Label |
|---|---|---|---|---|
| transition | ease | 150ms | --transition-speed: color, background and border changes on buttons, links and inputs | published |
| transition-fast | ease-out | 80ms | --transition-speed-fast with --transition-timing-fast: the button press scale | published |
| transition-slow | ease | 250ms | --transition-speed-slow: slower reveals | published |
| press | ease-out | 80ms | Buttons scale to 0.95 on :active | published |

## Icon tokens

Grid not published, stroke not published (an icon font: fontutti) (published).
| Name | Size | Use |
|---|---|---|
| button icon | 12px | max width of an SVG icon inside a button (Web Assets button mixin) |

## Signature moves

### Heavy Inter headings (synthetic bold on the variable face)

Where: every 600 and 800 heading: section labels, feature titles, hero and massive titles.
Do: Load Inter exactly as blender.org does: ONE @font-face for the variable file registered at font-weight: 400 only (src Inter-Variable.ttf format('truetype'), font-weight: 400, font-style: normal), and set every weight with font-variation-settings: "wght" N alongside font-weight N. Never register the face as 'font-weight: 100 900'. Because the face is registered at 400, Chrome adds synthetic bold on top of the 600 and 800 axis weights: headings (28px section labels 600, 32px feature titles 600, 72px titles 800) render visibly heavier than a plain Inter 600/800 at the same advance width ("Latest News" 28px: 168.1px wide either way). Weights below 600 (400 body, 500 buttons) get no synthesis. Verified 2026-10-30 by rendering both setups against the live page. Set -webkit-font-smoothing: antialiased and -moz-osx-font-smoothing: grayscale on html and body, as blender.org does. Without it, 400 body text (24px feature copy, 20px box paragraphs) renders visibly heavier and denser than the live page; with it plus the 400-registered face, headings stay heavy and body stays light..
Don't: Don't register Inter as font-weight 100 900 or load Google Fonts Inter: headings then render a clear step lighter than blender.org. Don't omit -webkit-font-smoothing: antialiased on html/body..

### The complete orange-and-blue logo

Where: the top-left of every blender.org page, credits, the logo kit; the only place the published colors appear.
Do: logomark plus lowercase 'blender' wordmark, horizontal, with the registered mark; orange #E87D0D swirl, blue #265787 eye and wordmark, white; full color with its white surround on images, or full color, black or white without the surround on simple plain grounds. One Blender logo per piece, and secondary to the owner's own brand when a third party uses it.
Don't: alter, recolor, enhance, crop to the mark alone (third parties), use it as your own logo, or show it more prominently than your own name.
Example: "blender".

### Artist-made hero art

Where: the hero of every blender.org page.
Do: a full-bleed render made with Blender (film still, splash screen) behind a left-aligned white Inter 800 title (72px desktop, line-height 1) and a 24px subtitle; .1rem .1rem .4rem 25% black text-shadow; ground #292D32 behind the image; the artist or studio credited as a small link at bottom right. One hero image per page, always credited.
Don't: use stock photography or uncredited art; Blender's own imagery is work made in Blender.
Example: "The Freedom to Create".

### Massive-title boxes

Where: homepage message sections (Free and Open Source, Part of the industry, It's about people.).
Do: a rounded 12px box with a soft shadow and 48px padding; a 72px Inter 800 heading (line-height 1.3) in one saturated color on its own tint: #46EBC2 on #1C1C1C, #0066FF on #F2F7FF, #9300FF on #F8F2FF; 20px body in #4C4D52 (white on the dark box). One color per box; each box a different color.
Don't: use the logo orange or blue for these headings (the site never does); stack two boxes of the same color.
Example: "Part of the industry".

### Blue gradient accent button

Where: the Donate button in the nav and footer; .btn-accent.
Do: linear-gradient(350deg, #6183FF, #47AAF5), white 500-weight text with a faint text-shadow, 6px radius, a layered blue glow (rgba(0,82,255) at 10%, 10% and 55%), heart icon before the label. One accent button in view.
Don't: use the gradient for secondary actions; those are #EAEDF0 grey or outlined.
Example: "Donate".

## Messaging: rules

Blender's own pages say the same few things: Free and Open Source software, forever; a community project funded by donations; part of the industry; the freedom to create. The homepage sections are the pillars in order.

Why it works: One promise (freedom) told through license, people and craft is easy to repeat and hard to copy for paid competitors.

|  |  |
|---|---|
| Mission | Best 3D CG technology in artists' hands, free/open source |
| Closing line | The Freedom to Create. |
| Footer note | Artistic freedom starts with Blender |
| Page title | The Free and Open Source 3D Creation Software |

- Lead with freedom: free to use, change, share and sell your work
- Name the people: contributors, artists, community
- Back industry claims with named members and patrons, never vague scale
- Show the work made in Blender, credited, rather than describing it
- Don't describe Blender as a trial, freemium or educational product
- Don't invent download or user counts: the site gives 'over 20 million downloads per year' and 'millions use it daily' only

Real examples, to look at on Blender's own pages (not for reuse):
- Homepage pillars as massive-title boxes: https://www.blender.org/ (2026-10-30)

Sources: https://www.blender.org/about/, https://www.blender.org/, https://www.blender.org/about/license/, https://www.blender.org/about/foundation/

## Voice: rules

No voice guide is published. On its own pages Blender is warm, direct and community-minded: short Title Case headings, plain explanations of license and funding, the odd exclamation ('Really!'), and generosity toward fans who remix the logo.

Why it works: A free project lives on goodwill; a friendly, transparent voice keeps contributors and donors close.

|  |  |
|---|---|
| Headings | Title Case (observed) |
| Spelling | en-US (observed) |
| Person | we / you |

- Title Case headings (observed); sentence case with a full stop for a few emphatic homepage lines
- Second person for rules and help ('You are welcome to credit Blender')
- Explain money and licensing plainly
- US spelling on the site
- Exclamations allowed sparingly in enthusiastic lines
- Don't sound corporate or salesy
- Don't abbreviate or alter the Blender name
- Don't imply third-party work is official

Not published: a voice or tone guide; a copy style guide (case, numbers, dates); banned words.

Real examples, to look at on Blender's own pages (not for reuse):
- Logo page: friendly second-person rules and the tribute paragraph: https://www.blender.org/about/logo/ (2026-10-30)

Sources: https://www.blender.org/about/logo/, https://www.blender.org/about/trademark-policy/, https://www.blender.org/about/, https://www.blender.org/about/license/, https://www.blender.org/

## Logo: rules

The Blender logo is the orange-and-blue logomark beside the lowercase 'blender' wordmark, with a registered mark. The logo page shows it full color with a white surround (the file names call it the socket), and three variations without the surround for simple plain grounds: full color, black and white. It must always be complete (logo plus text). A community badge (white, black, orange shield with the mark and wordmark) is the sanctioned way for creators to show Blender was used.

Why it works: A single complete lockup in fixed colors, plus a separate badge for fans, keeps the official mark unambiguous while still letting the community celebrate Blender.

|  |  |
|---|---|
| Colors | PMS 716 #E87D0D, PMS 647 #265787, white #FFFFFF |
| Lockup | logomark + 'blender' wordmark, horizontal, with ® |
| Variations | full color with white surround; full color, black, white on plain grounds |
| Clear space | not published |
| Minimum size | not published |
| Badge | white, black, orange; PNG and SVG |

- Logo plus text 'blender' always complete, unaltered, in original colors and typography
- Full color with the white surround by default; full color, black or white variations only on a simple or plain-color ground
- Third parties: only to credit Blender or link to blender.org; links point to blender.org
- Third parties: always a secondary brand, less prominent than their own
- Promotional items (event T-shirts, booths) allowed as a secondary brand; commercial products need explicit permission
- In credits: type 'made with Blender' rather than using the logo alone; the logo may sit among other logos
- Community badge: only to indicate Blender was used, as-is, never as your own logo
- Artistic tributes that modify the logo are tolerated but never officially approved
- Don't use the Blender logo as your own logo
- Don't modify, enhance, recolor or show the logo incomplete
- Don't use the logo in isolation in credits
- Don't use Blender's name or logo in a business, product, app or domain name
- Don't put the trademark on merchandise for sale
- Don't display the trademark more prominently than your own name
- Don't combine the mark with other symbols, words or images, or put it in a slogan

Not published: clear space; minimum size; logomark-alone usage for Blender's own materials; placement rules; wordmark construction or typeface (the lettering is custom; no source names it).

Real examples, to look at on Blender's own pages (not for reuse):
- Full-color logo with its white surround: https://www.blender.org/about/logo/ § Logo
- Full color, for simple plain grounds: https://www.blender.org/about/logo/ § variations
- One color black: https://www.blender.org/about/logo/ § variations
- One color white: https://www.blender.org/about/logo/ § variations
- Credit typed out: made with Blender (Spring): https://www.blender.org/about/logo/ § Usage in Credits
- Logo among other logos in credits (Sintel): https://www.blender.org/about/logo/ § Usage in Credits
- Logomark among other 3D software icons: https://www.blender.org/about/logo/ § Usage in Credits
- Community badge on a creator's thumbnail: https://www.blender.org/about/logo/ § Community Badge
- Earlier Blender logos: https://www.blender.org/about/logo/ § A Trip Down Memory Lane

Sources: https://www.blender.org/about/logo/, https://www.blender.org/about/trademark-policy/

## Color: rules

Two palettes, scoped. The logo page publishes the brand colors: PMS 716 orange #E87D0D, PMS 647 blue #265787 and white. The website runs on Web Assets' neutral slate system instead: #F2F2F3 ground, #FAFAFA boxes, #4C4D52 text, #292D32 dark bands and footer, and an interactive blue #0099FF with a #6183FF-#47AAF5 gradient on the Donate button. The logo colors never appear in the UI. Homepage message boxes add one saturated heading color each (teal, blue, purple) on a matching tint.

Why it works: A quiet grey frame lets the community's Blender-made art supply the color, and keeps the orange-blue logo distinct.

|  |  |
|---|---|
| Logo | #E87D0D / #265787 / #FFFFFF (PMS 716 / 647) |
| Ground | #F2F2F3 (hsl 210 4% 95%) |
| Box | #FAFAFA |
| Text | #4C4D52 (hsl 230 4% 31%); muted #8D8E96; faint #B2B3B8 |
| Accent | #0099FF (hsl 204 100% 50%) |
| Accent button | 350deg #6183FF to #47AAF5 |
| Dark | #292D32; global nav #1C1E22 |
| Proportions | not published |

- Logo colors only in the logo and the community badge
- Page ground #F2F2F3, boxes #FAFAFA, text #4C4D52; dark bands #292D32 with white text
- Links and interactive states in #0099FF; primary accent button is the blue gradient
- Status colors from Web Assets (info #13BDE7, success #6BB125, warning #E4A511, danger #EE5353) with their light backgrounds
- A dark theme exists in Web Assets (#1C1E22 ground, #C7CBD1 text)
- Don't recolor the logo
- Don't set UI elements in the logo orange (not done anywhere on blender.org)
- Don't add new heading colors outside the observed teal, blue, purple boxes without reason

Not published: color proportions; CMYK or RGB breakdowns of the logo colors; a rule tying the logo colors to the web palette; the homepage box colors (set per block in WordPress, not in Web Assets).

Real examples, to look at on Blender's own pages (not for reuse):
- Logo page: swatches PMS 716, PMS 647, White: https://www.blender.org/about/logo/ (2026-10-30)
- Massive-title boxes in blue and purple on tints: https://www.blender.org/ (2026-10-30)

Sources: https://www.blender.org/about/logo/, https://projects.blender.org/infrastructure/web-assets (src/styles/_variables.sass), https://www.blender.org/wp-content/themes/bthree/style.css (2026-10-30), https://www.blender.org/ (2026-10-30)

## Typography: rules

One family: Inter, the open variable face, shipped in Web Assets and used for everything. Headings are 600; hero titles and homepage 'massive titles' are 800. Sizes step up at two breakpoints (900px and 1220px). Tracking is normal. Mono is a system stack.

Why it works: One open, highly legible face at a few weights matches a free-software project and keeps the art in front.

|  |  |
|---|---|
| Family | Inter variable (OFL 1.1) |
| Weights | 300 / 400 / 500 / 600 / 800 |
| Hero | 72px desktop, 55 tablet, 36 phone; lh 1 |
| Body | 18px / 28px desktop |
| Mono | ui-monospace system stack |
| rem | 1rem = 10px (html 62.5%) |

- FONT LOADING (build-critical): Load Inter exactly as blender.org does: ONE @font-face for the variable file registered at font-weight: 400 only (src Inter-Variable.ttf format('truetype'), font-weight: 400, font-style: normal), and set every weight with font-variation-settings: "wght" N alongside font-weight N. Never register the face as 'font-weight: 100 900'. Because the face is registered at 400, Chrome adds synthetic bold on top of the 600 and 800 axis weights: headings (28px section labels 600, 32px feature titles 600, 72px titles 800) render visibly heavier than a plain Inter 600/800 at the same advance width ("Latest News" 28px: 168.1px wide either way). Weights below 600 (400 body, 500 buttons) get no synthesis. Verified 2026-10-30 by rendering both setups against the live page. Set -webkit-font-smoothing: antialiased and -moz-osx-font-smoothing: grayscale on html and body, as blender.org does. Without it, 400 body text (24px feature copy, 20px box paragraphs) renders visibly heavier and denser than the live page; with it plus the 400-registered face, headings stay heavy and body stays light.
- All card titles (news, Development, Studio, people cards) use text-wrap: balance, so 2-line titles split into even halves (e.g. 'Connecting / Blender Community', 'Showcasing Blender / at industry events', 'BCON26: Blender / Studio talks'). The hero subtitle also uses balance. Body paragraphs do not.
- Inter for all text; weights 300, 400, 500 (buttons), 600 (headings), 800 (hero/massive titles)
- Hero title 36 / 55 / 72px, line-height 1
- h1 28 / 32px, h2 24 / 28px, h3 21 / 24px, h4 18 / 21px, h5 16 / 18px (base / from 900px)
- Body 14 / 16 / 18px, line-height 20 / 28px
- Section labels left-aligned, Title Case; card titles and captions sentence case as published
- Don't add letter-spacing
- Don't use a second display face
- Don't set long text in 800

Not published: a typographic guide (pairing, hierarchy rules for print); the wordmark's lettering.

Real examples, to look at on Blender's own pages (not for reuse):
- Inter 600 feature heads and 400 body on #F2F2F3: https://www.blender.org/ (2026-10-30)

Sources: https://projects.blender.org/infrastructure/web-assets (src/styles/_variables.sass, _type.sass, _fonts.sass)

## Graphic elements: rules

Graphic language comes from Web Assets components: rounded boxes (12px) with soft shadows, 6px buttons, 2px borders and focus rings, hero art with a text-shadowed title, and the blue gradient accent button with a glow.

Why it works: Soft, rounded containers on a neutral ground read as a tool interface, close to Blender's own UI, and frame the art.

|  |  |
|---|---|
| Radius | 6px / 12px |
| Border | 2px |
| Spacer | 16px base; 4, 8, 16, 24, 48, 96, 192 |
| Shadow | 0 .2rem .4rem rgba(0,0,0,.05) |

- Boxes: #FAFAFA, radius 12px, shadow 0 .2rem .4rem rgba(0,0,0,.05), padding 24px
- Images and covers: radius 12px
- Buttons: radius 6px, weight 500, padding 8px 16px
- Focus: 4px #0099FF outline
- Blockquote: #EAEBEB fill, 8px left rule #E2E3E4
- Scope: the Web Assets generic .box (#FAFAFA, padding 24px) is for app/docs pages; homepage boxes are the tinted massive-title boxes with 48px padding (see Page anatomy). A landing page follows the homepage.
- Don't use sharp corners on boxes or media
- Don't use heavy drop shadows

Real examples, to look at on Blender's own pages (not for reuse):
- Rounded #FAFAFA box overlapping the hero: https://www.blender.org/about/logo/ (2026-10-30)

Sources: https://projects.blender.org/infrastructure/web-assets (src/styles/_variables.sass, _button.sass, _type.sass), https://www.blender.org/wp-content/themes/bthree/style.css (2026-10-30)

## Iconography: rules

Icons come from 'fontutti', an icon font built with Fontello and shipped in Web Assets: mostly custom glyphs plus a few from Font Awesome, Typicons and Entypo. They inherit the text color. Social icons in the footer are single-color glyphs.

Why it works: A single icon font keeps every blender.org site consistent and lightweight.

|  |  |
|---|---|
| Set | fontutti (Fontello), 152 glyphs |
| Color | currentColor |
| Grid / stroke | not published |

- Icons inherit currentColor
- Max 12px SVG icon inside buttons
- Heart icon before Donate
- Don't recolor icons independently of their text

Not published: an icon drawing guide (grid, stroke, corners).

Real examples, to look at on Blender's own pages (not for reuse):
- Footer social icons and the heart Donate button: https://www.blender.org/about/logo/ (2026-10-30)

Sources: web-assets fontutti_config.json, web-assets src/styles/_mixins.sass

## Illustration: rules

Blender has no illustration system. Its 'illustration' is 3D artwork made in Blender: Blender Studio film characters, splash screens and community renders, sometimes used as characters in campaigns (the survey cat).

Why it works: The product is a creation tool; showing what it makes is the strongest proof.

|  |  |
|---|---|
| Source | Blender Studio and community artists |
| Credit | small link in the hero corner |

- Use art made in Blender, credited to its artist or studio
- Don't use generic vector illustration or stock art

Not published: an illustration style.

Real examples, to look at on Blender's own pages (not for reuse):
- Survey 2026 card with a Blender Studio character: https://www.blender.org/ (2026-10-30)

Sources: https://www.blender.org/ (2026-10-30), https://www.blender.org/about/website/

## Photography: rules

Imagery is Blender-made art, not photography: each page hero is a render or film still (Blender Studio, Ian Hubert, Reynante Martinez, Robin Tran) with a credit. Photography appears only as event and community pictures (conference, people cards) and in news cards, cropped with 12px corners.

Why it works: Credited community art makes every page a showcase and honors the people the project is about.

|  |  |
|---|---|
| Hero art | render or film still, cover, center top |
| Credit | artist/studio link |
| Image corners | 12px |

- Hero: one full-bleed Blender-made image, credited
- Event photos for community and conference content
- 12px radius on cards and images
- Don't use uncredited artwork
- Don't use stock photography

Not published: a photography guide.

Real examples, to look at on Blender's own pages (not for reuse):
- Homepage hero art (Blender Studio, OVERGROWN): https://www.blender.org/ (2026-10-30)
- About page hero by Ian Hubert: https://www.blender.org/about/ (2026-10-30)

Sources: https://www.blender.org/ (2026-10-30), https://www.blender.org/about/ (2026-10-30), https://www.blender.org/about/website/

## Motion: rules

Motion is UI-level only: 150ms transitions on color, background and border, an 80ms ease-out press that scales buttons to 0.95, and a 250ms slow speed.

Why it works: Quick, small transitions keep the site feeling like a responsive tool.

|  |  |
|---|---|
| Speed | 150ms |
| Fast | 80ms ease-out |
| Slow | 250ms |
| Press | scale(0.95) |

- Transitions 150ms; fast 80ms ease-out; slow 250ms
- Buttons scale to 0.95 on press
- Don't add long or decorative animations

Not published: brand motion or video guidelines.

Sources: https://projects.blender.org/infrastructure/web-assets (src/styles/_variables.sass, _mixins.sass)

## Interface and layout: rules

Web Assets publishes a 16px spacer scale and a centered container: 1170px at the lg breakpoint, with breakpoints at 900, 980, 1220, 1380 and 1680px. Root font-size is 62.5% so 1rem = 10px. The primary navbar is 64px. Heroes are full-bleed, 480-560px tall (min 30, max 35 spacers), with content left-aligned; boxes overlap the hero bottom on inner pages.

Why it works: A conventional, documented grid lets many blender.org sites share one framework.

|  |  |
|---|---|
| Container | 1170px (lg) |
| Breakpoints | 900 / 980 / 1220 / 1380 / 1680 |
| Spacer | 16px |
| Nav | 64px |
| Hero | 480-560px |

- Container 820 / 940 / 1170 / 1320 / 1600px at sm / md / lg / xl / xxl
- Breakpoints 900, 980, 1220, 1380, 1680px
- Spacer 16px: 4, 8, 16, 24, 48, 96, 192
- Navbar 64px (4 spacers)
- Hero min 480px, max 560px, height 100vh minus 96px
- Content left-aligned by default (hero alignment classes allow center or right)
- Don't center-align long text
- Don't invent a new spacing scale

Real examples, to look at on Blender's own pages (not for reuse):
- Homepage: nav, full-bleed hero, news grid: https://www.blender.org/ (2026-10-30)

Sources: https://projects.blender.org/infrastructure/web-assets (src/styles/_variables.sass, _media_queries.sass, _hero.sass)

## Rules: rules

The published rules are legal: the logo usage guidelines and the trademark policy. Their goal, in the policy's words: make community use easy, make business use clear, and stop anyone who would 'unfairly profit from, trick or confuse people'.

Why it works: Blender's code is free, but the name and logo are not part of the GPL; protecting them keeps official Blender identifiable.

|  |  |
|---|---|
| Trademark | registered EU and USA, in use since 2002 |
| Logo license | not GPL; Blender Foundation property |
| Website content | CC BY-SA unless noted |

- Without permission: refer or link to unmodified Blender in text; use logos to point to Blender on Blender servers; describe add-ons, compatibility and community accounts truthfully
- Community accounts may not start their name or handle with 'Blender'
- Everything else needs prior written permission, including domain names
- Secondary taglines are fine ('Awesome Company Inc., the Blender specialists')
- Forks need a new name and brand
- Commercial references limited to truthful descriptions ('Independent technical support for Blender')
- Don't use Blender in a business, product, app, domain or publication name
- Don't use confusingly similar marks, names or designs
- Don't imply affiliation, sponsorship or endorsement
- Don't sell merchandise with the trademark
- Don't modify, abbreviate or combine the trademark

Real examples, to look at on Blender's own pages (not for reuse):
- Trademark policy page: https://www.blender.org/about/trademark-policy/ (2026-10-30)

Sources: https://www.blender.org/about/trademark-policy/, https://www.blender.org/about/logo/, https://www.blender.org/about/website/

## Campaigns

### Open Movies (2026)

Blender Studio's open films (Spring, Sintel and others), celebrated in a September 2026 press release marking 20 years of Open Movies; current productions OVERGROWN and Cowboi feature on the homepage.

How the system shows: Film stills are the hero art; film credits are the logo page's own examples of crediting Blender.
Why it works: The films push development and prove the tool at once.
Channels: film, press, web. Source: https://www.blender.org/press/

### Community badge

A shield badge in white, black and orange that creators add to thumbnails to show content was made with Blender.

How the system shows: The logomark and wordmark in a shield, in the brand orange or neutral, kept as-is.
Why it works: Gives fans an official way to brand their work without borrowing the logo itself.
Channels: YouTube thumbnails, tutorials, books. Source: https://www.blender.org/about/logo/ § Community Badge

## Applications

| Format | What | Source |
|---|---|---|
| film credits | 'made with Blender' typed out in end credits (Spring); logo among partner logos (Sintel). | https://www.blender.org/about/logo/ § Usage in Credits |
| creator thumbnails | Community badge in a top corner of tutorial thumbnails. | https://www.blender.org/about/logo/ § Community Badge |
| software listings | The logomark in grey among other 3D software icons. | https://www.blender.org/about/logo/ § Usage in Credits |
| annual report | Printed report with the full-color logo and slate/blue diagrams (homepage card). | https://www.blender.org/ (2026-10-30) |
| conference stage | Logo projected at BCON (homepage news photo). | https://www.blender.org/ (2026-10-30) |

## By format

How our engine applies Blender's system to each format. This is our recipe built from their rules, not something Blender publishes. Third parties may use Blender's logo only as a secondary credit; these rows describe Blender's own materials. 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 | 2 | Build it the way blender.org is built (kit.spec.page): #D9F5FC alert line, white 64px nav with the full-colour logo left and seven 14px links plus the gradient Donate right, a 640px full-bleed credited Blender-made hero with a bottom-left white Inter 800 72px title and two 6px-radius buttons, #F2F2F3 page with 28px Inter 600 Title Case section labels and transparent cards (12px radius thumbnails, soft shadow), 12px-radius massive-title boxes, #292D32 sitemap footer. Homepage voice (plain, factual), not campaign voice | how many card rows; which massive-title boxes (teal/dark, blue, purple, photo+gradient) and in what order; the hero art and release |
| Deck | 2 | Full-color logo, Inter, slate grounds (#F2F2F3 or #292D32), credited Blender-made art as full-bleed slides | a massive-title color per section divider |
| Proposal page | 1 | #F2F2F3 ground, #FAFAFA boxes, #4C4D52 Inter text, #0099FF links, one blue accent button | one credited render in the header |
| Social post | 3 | Blender-made art, credited; logo or community badge as-is | a massive-title color headline |
| Video thumbnail (community) | 3 | Community badge unaltered in a corner, the creator's own brand more prominent | badge color: white, black or orange |

## Checks before anything ships

- **Logo hidden**: Cover the logo. It should still read as blender.org: Inter on slate grey, rounded 12px boxes, a credited render made in Blender, freedom-first copy.
- **Swap test**: Put another 3D tool's logo on it. If the art credits, the free-and-open-source message and the community voice don't feel out of place, it's generic.
- **Trademark**: The logo is complete and unaltered, and nothing implies a third party is official Blender.

## 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 Blender'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

- No brand guide exists beyond the logo page and the trademark policy; this book reads the rest from blender.org and the Web Assets source.
- Logo clear space and minimum size: not published.
- Logo color breakdowns beyond PMS and hex (CMYK, RGB): not published.
- The site's logomark SVG uses #EA7600, not the published #E87D0D: check with the Blender Foundation before print.
- Color proportions: not published.
- A rule linking the logo colors (orange, blue) to the web UI palette (greys, #0099FF): not published; the site keeps them apart.
- The homepage massive-title colors (#46EBC2, #0066FF, #9300FF and their tints) are set per block in WordPress, not in Web Assets: observed only.
- Voice, tone and copy style (case, numbers, dates): not published; all voice rules here are observed or inferred.
- Wordmark lettering: custom, no typeface named; not published.
- Icon drawing rules (grid, stroke): not published; icons are an icon font.
- Photography and illustration guidelines: not published.
- Brand motion (video, logo animation): not published; only UI transition speeds.
- Official logo kit (download.blender.org/branding/blender_logo_kit.zip) and community badge files are behind a bot challenge; logo images come from the logo page's own previews.
- Positioning, audience and pillars are read from site copy, not a published strategy.

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