Beams Brand Guide

Mission

What Beams stands for

Beam yourself into the world. One sentence. Ten seconds. Done.

Beams exists for the 137 million creators who never built a bio page because it was too much work. We believe your digital presence should take seconds, not hours. AI handles the design so you can focus on what you actually create.

Logo

The Beams wordmark with icon

Beams

Clear space

Maintain minimum clear space equal to the height of the icon on all sides. Never distort, rotate, or recolor the logo.

Colors

The Beams palette

Primary gradient

linear-gradient(135deg, #8b5cf6, #3b82f6, #06b6d4)

Core colors

Purple

#8b5cf6

Blue

#3b82f6

Cyan

#06b6d4

Green (success)

#10b981

Backgrounds

Base

#0a0a0b

Elevated

#111113

Card

#18181b

Border

#27272a

Text

Primary

#fafafa

Secondary

#a1a1aa

Muted

#71717a

Typography

System font stack for maximum performance

-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif

Scale

H1 — Hero headline

Beam yourself.

H2 — Section title

Everything your digital identity needs

H3 — Card title

AI Generation

Body

Describe yourself in plain language. AI creates a beautiful, personalized page with the right layout, colors, and copy.

Small / Label

FEATURES

Spacing

Consistent spacing units

4

Micro

8

Small

16

Medium

24

Large

Border radius: 12px cards, 8px buttons, 100px pills

Components

Reusable UI elements

Buttons

Get Started Free Learn More View Pricing →

Badge

Now in public beta

Card

Real-Time Analytics

See who visits, where they come from, and which links they click.

Voice & Tone

How Beams speaks

Confident, direct, outcome-focused. We say less and mean more. No fluff, no jargon, no apologies. Every word earns its place.

Do

"Type one sentence. Get your page."

Don't

"Our AI-powered platform leverages machine learning to create customized web pages."

Do

"Beam yourself."

Don't

"Create your personalized digital identity profile page today!"

Do

"Free forever. No credit card."

Don't

"Sign up for our generous free tier to get started with basic features at no cost."

Taglines

Primary: "Beam yourself."

Descriptive: "One sentence. One page. Everywhere."

Action: "Beam yourself into the world."

Usage Rules

What to do and not do

Always

Use the gradient for primary CTAs and hero elements
Dark backgrounds (#0a0a0b) for all pages
System font stack (no custom font loading)
12px border-radius on cards, 8px on buttons
Outcome-first copy ("Get your page" not "AI page generation")

Never

Use the logo on a busy/patterned background
Change the gradient colors or direction
Use light mode (dark-only brand)
Add fake stats, testimonials, or user counts
Use emojis in headlines or CTAs