Inside the VCASS website design
VCASS is an education website built with WordPress and Next.js. Its pages are built from navbar, features, editorial, hero, feature grid, gallery, and footer sections, shown here in full-page captures and a scroll recording. Typography: Font Waslsheim Condensed (display text and headings) and Font Waslsheim (body text). Colours: background #1F1E1D, text #E6E5DD, surface #FFBC5E.
Its visual style is bold, typographic, and photographic, with navigation bar, hero with background imagery, and feature card among its components.
Why we picked it
Oversized bold headlines with small emoji-like photo inserts tucked into the text give a school site real energy, while a dark band breaks into a warm orange whats-on section. Real student and performance photos throughout, and rounded program icons for music, dance, theatre and visual arts, make scanning what's offered quick and the place feel alive.
What to look for
- Navbar: a short menu: only the destinations visitors actually look for
- Features: benefits framed around what the user gets, not internal capability names
- Editorial: expressive typography with comfortable reading measure
- Hero: a specific headline instead of a generic slogan
Questions designers ask
What fonts does VCASS use?
VCASS uses Font Waslsheim Condensed for display text and headings, and Font Waslsheim for body text, measured from the captured page's CSS.
What is the VCASS website built with?
The VCASS website is built with WordPress and Next.js, detected when the page was captured.
What colours does the VCASS website use?
Measured from the captured page's CSS, the VCASS website uses #1F1E1D for the background, #E6E5DD for text, and #FFBC5E for surfaces.
What sections does the VCASS website have?
The VCASS website includes navbar, features, editorial, hero, feature grid, gallery, and footer sections. Each one opens on its own page, so you can compare it with the same section on other websites.
