PRODUCT

Campus

A community learning platform, open to anyone.

01

Overview

Campus is Build Club's community learning platform — open to anyone, playful and welcoming by design. Its identity leans into a vivid lime, an isometric grid, glassmorphic surfaces, and the Jersey 25 pixel display.

01
Open to anyone

Campus welcomes every builder, wherever they're starting from.

02
Playful by default

Bright lime, a pixel mascot, and game-like energy make learning feel light.

03
Learn by building

Progress comes from shipping — courses, challenges, and projects, not lectures.

03

Color

Primary
Blue#0068F9
Secondary
Lime#9BB400
Accent
Tangerine#FF4E27
Neutral
Neutral#464246

Surfaces

Background#F7FBEA
Card#FFFFFF
Muted#F6FEB8
Border#E6EFD0

Ramps

BluePrimarycore/blue· Also inAcademy
LimeSecondarycore/lime· Also inAcademy
TangerineAccentcore/tangerine
NeutralNeutralcore/neutral· Global

Gradients

Click to inspect from / to / direction + CSS.

Elements

Content-type colors. Each pairs a deeper tone with a lighter tint — reverse background/icon as needed.

Functional

System states — a light surface with a deep icon, or reversed.

Levelling

Campus and Academy render the learning ladder in blue — the top tier is a gradient.

Tier / Leaderboard

Rank tiers shared across brands — each a metallic gradient.

Core tokens

Shared by every brand.

#0068F9
Blue · 700
PrimaryExact
HEX#0068F9
RGBrgb(0, 104, 249)
Tokencore/blue/700
04

Typography

AgDisplay
Jersey 25
130% line height · −2% tracking
AgBody
DM Sans
150% line height · 0% tracking
AgMono
PT Mono
150% line height · 4% tracking
DisplayBuild the thing.
Heading 1Build the thing.
Heading 2Build the thing.
Heading 3Build the thing.
BodyBuild the thing.
SmallBuild the thing.
MonoBuild the thing.
05

Voice & Tone

PlayfulEncouragingPlainspoken
Do
  • Cheer people on and keep momentum.
  • Use concrete, doable next steps.
  • Let the lime + pixel motif carry the fun.
Don't
  • Don't talk down to beginners.
  • Don't be precious or corporate.
  • Don't overuse the accent — lime leads, tangerine punctuates.
06

Motifs & Backgrounds

Isometric grid + glass

Campus sits on a lime isometric grid with glassmorphic cards and a pixel mascot — energetic and game-like.

07

Glyphs

Campus's playful side is carried by a set of Streamline-Pixel glyphs — pixel-art creatures and objects that pair with the Jersey 25 display and the lime isometric grid. The pixel dinosaur is the recurring mascot. They live in icons/pixel/ as crisp, recolourable SVGs.

T-RexT-Rex
TurtleTurtle
FrogFrog
RobotRobot
Ice creamIce cream
RabbitRabbit
PandaPanda
DogDog
BreadBread
AndroidAndroid
CatCat
KnightKnight
08

Imagery

Coming soon
In progress

Photography and illustration direction is in progress.

09

Layout & Spacing

Corner radius

Base radius drives every surface via --radius.

Spacing scale
4
8
12
16
24
32
48
64
10

UI Components

Badge

Every element reads the brand's live Tailwind tokens — no per-brand markup.

11

Marketing

Coming soon
In progress

Product UI, social, and collateral applications will be showcased here.

12

Accessibility

Primary
4.83:1AA
Body
16.10:1AAA
Accent
9.48:1AAA
On card
16.96:1AAA
Muted
5.74:1AA
Secondary
11.21:1AAA
13

Assets & Downloads

Coming soon
Assets folder

This brand's logos, fonts, imagery, and downloads live in one folder, nested under the brand. Drop files here and they'll be wired up as they land.

public/brands/build-club/campus/
logo/fonts/color/imagery/icons/downloads/