Cosmic Reach Creative
The Cosmic Reach Brand System

Signal, not static.

We navigate organizations through the nebula of complexity with clarity, systems, decision-ready design, and structured communication. This page is the system itself. Every color, every typeface, and every transition you read below is the live token set we build on.

Scroll to navigate
Why space

Predominantly unexplored.

I have always looked up. The stars, the sky, whatever is past them. The part that pulls at me is that most of it is still unknown.

It is the same reason I like this work. Every business I sit down with has territory nobody has looked at yet. The thing the founder says out loud on a call but never puts on the site. The offer that has never been written down. The real reason people buy. You do not find any of that by arriving with a template. You find it by listening long enough to be surprised.

Apollo 13 is the mission I keep coming back to. Not because it went to plan, because it did not, but because when it broke, the crew and the room full of people on the ground built the answer out of what was already on board. That is the job. Work the problem with what is in the room.

So, space. Not as decoration. Because curiosity is the method.

Reach further. Create with purpose.

Strategy · Brand · Design · Content

Language

The frequency we broadcast on.

We sound like

  • A navigator in the control room
  • Plain language, precise value
  • Confident but never arrogant
  • Technical when the mission requires it

We never sound like

  • Corporate jargon
  • Drifting without gravitational pull
  • Noise without purpose
  • Filler that serves no purpose

Mission Control

Instructional, steady orbit.

Guide the user to their destination.

Deep Space Broadcast

Confident, discovery-focused.

Earn attention through luminosity.

Course Correction

Human, direct, recalibrating.

Never blame the crew.

Form · Logo

A helmet, and what it reflects.

It reads as an astronaut helmet. It is really a comms headset, and every part of it is an argument about how the work gets done. The facemask is always blue, ringed in cream on dark grounds and solid on light ones. On Deep Space use the cream variants, on light backgrounds the navy ones, and the two-tone mark anywhere it has room to breathe.

The integrated headphones

Listening first. Every solution begins with the client, never with a template.

The microphone mouthpiece

Helping clients find, clarify, and amplify their voice.

The lightning-bolt visor reflection

The energy and momentum Cosmic Reach brings to every engagement.

The 1 in the wordmark

Direct, senior-level partnership. Clients always work with the people doing the work.

Cosmic Reach Creative primary lockup

Primary lockup

Helmet above the type. The default brand signature.

primary-lockup/ ↓ SVG
Cosmic Reach Creative horizontal lockup

Horizontal lockup

Helmet left, type right. For headers and email footers, where vertical space is tight.

horizontal-lockup/ ↓ SVG
Cosmic Reach Creative logo mark

Logo mark

The helmet alone. Avatars, favicons, and anywhere small.

logo-mark/ ↓ SVG
Cosmic Reach Creative wordmark

Wordmark

Type alone, for when the helmet has already appeared on the page.

wordmark/ ↓ SVG
Cosmic Reach Creative logo on deep space

Dark background · starlight mark, preferred

Cosmic Reach Creative logo on light

Light background · navy mark

Do not

Recolor the artwork

The logo files are final as shipped. Palette tokens are for design surfaces, not for restyling the mark.

Stretch or distort

Scale proportionally. The helmet's geometry is the recognition.

Shrink the full lockup

Below roughly 40px the helmet loses its interior detail. Use the mark alone at small sizes.

Add shadow or outline

The mark carries its own contrast. Effects flatten it.

The mark earns recognition by staying the same. Every exception spends a little of that.

Color

Color is gravity.

Foundation is the dark matter. Structure is copper, the orbital lines. Spark Red is the supernova. It marks the moment something ignites. A dot, a line, a flare. Never a flood.

Measured coverage

50.4M pixels · 7 full pages · 1440 wide

Deep Space
74%
Photography
14.9%
Surface
9.6%
Starlight
1.3%
Copper
0.2%
Spark Red
0.001%

Area is not attention. Starlight and Copper occupy under two percent of the site between them and carry almost all of the reading. Spark Red lands at one thousandth of one percent, which is the rule working: a dot, a line, a flare, never a flood.

FoundationDeep Space#0B1120The dark matter. The canvas of deep space.
FoundationSurface#121826Secondary panels and raised surfaces.
ForegroundStarlight#E5DED0Primary text and light. The signal you read.
StructureCopper#CCA67BOrbital lines and coordinates. Labels and rules.
SupernovaSpark Red#CE534DThe signal flare. One element per view, never a flood.
Typography

Type is the telescope.

Aa

Behind The Nineties

Display, wordmark, editorial headlines. A variable serif from Casloop Studio, licensed through YouWorkForThem. It carries every headline on this site and never does the reading work.

Variable 300–900 · used at 505–530 · never above Bold

Aa

Familjen Grotesk

Navigation, body, metadata, and every piece of interface. Neutral and steady, so the serif never has to compete with it. Ground control.

The quick brown fox jumps over the lazy dog.

display-xlclamp(2.5rem, 5.8vw, 5.5rem)LH1.02Wt530
display-lclamp(1.875rem, 4vw, 3.5rem)LH1.08Wt515
display-mclamp(1.375rem, 2.4vw, 2rem)LH1.16Wt505
body-leadclamp(1.0625rem, 1.4vw, 1.1875rem)LH1.65Wt400
eyebrow0.6875remLH1.2Wt500
Structure

The orbital mechanics of layout.

Spacing scale

XS4px
SM8px
MD16px
LG32px
XL64px
XXL96px

Radius

Every container has rounded corners. Nothing sharp. Soft like a planet’s horizon.

sm 8px
md 12px

Responsive grid

Desktop
12-column orbit
Tablet
8-column orbit
Mobile
4-column orbit
Motion

Celestial bodies move with purpose.

So does every pixel. Three speeds, one curve. The interface answers in 300ms, headings and sections arrive over about a second, and atmosphere drifts slower than either. Everything moves on opacity and transform, never on layout.

Interface

300ms

Arrivals

≈1s, GSAP

Easing

cubic-bezier(0.22, 1, 0.36, 1)

Scroll

Lenis, lerp 0.1

This panel is drifting on the same easing the system ships with. Motion responds. It never performs.

Embrace

  • Real NASA photography and footage
  • Earthrise, launch, lunar surface, control rooms
  • Instruments built for a job
  • Credited, every time

Avoid

  • Neon galaxy stock
  • Sci-fi cliches
  • Stock smiles in offices
  • Over-processed textures
  • Imagery that decorates instead of informs
Transmission

A star system only works when the signal travels.

The system ships as tokens, so the brand stays identical from a proposal to production. The same values that render this page are the deliverable, not a screenshot of a style guide.

  • tokens.css
  • tokens.json
  • tokens.scss

When systems align, momentum follows.

We build the infrastructure of growth. The same system you just read through is the one we build for every brand we take on.