Inside the Campus website design
Campus is an education website built with custom code and Next.js. Its pages are built from navbar, other, stats, process, CTA, hero, team, and footer sections, shown here in full-page captures and a scroll recording. Typography: SF Pro Text (display text, headings, and body text). Colours: background #FFFFFF, text #080808, main buttons #4F50FF, secondary text #575757.
Campus is an online college with professors who also teach at top universities. Explore our online programs. Elite education for all. Its visual style is typographic, corporate, and bold, with announcement bar, navigation bar, and hero among its components.
Why we picked it
Oversized black headlines and plain stat numbers like 2 yrs and >80% cut through the usual college marketing fog, making costs and format easy to scan in seconds. Real video stills of students and professors, plus a vertical step-by-step list with photos, build trust by showing actual people instead of stock campus shots.
What to look for
- Navbar: a short menu: only the destinations visitors actually look for
- Stats: three or four numbers that matter to the buyer
- Process: three to five numbered steps
- CTA: a short restatement of the main benefit
Questions designers ask
What fonts does Campus use?
Campus uses SF Pro Text for display text, headings, and body text, measured from the captured page's CSS.
What is the Campus website built with?
The Campus website is built with custom code and Next.js, detected when the page was captured.
What colours does the Campus website use?
Measured from the captured page's CSS, the Campus website uses #FFFFFF for the background, #080808 for text, #4F50FF for main buttons, and #575757 for secondary text.
What sections does the Campus website have?
The Campus website includes navbar, other, stats, process, CTA, hero, team, and footer sections. Each one opens on its own page, so you can compare it with the same section on other websites.
