Support Local. Eat Fresh.
Project Overview
A brand guide, brought to life on the web.
Client
Farm to Table CSA (fictional)
Project
GRA310
Tools
Bootstrap 5.3 · Custom CSS
Deliverable
Responsive 4-page website
Built to the brand, coded to standard.
Starting from the Farm to Table brand style guide, I designed and built a responsive, accessible website that takes the brand from a static document to a working multi-page site.
The build runs on Bootstrap 5.3 for a responsive grid, with custom CSS layered on top to apply the brand exactly: its earthy palette, its Red Hat Display and Zilla Slab type, and its logo usage rules. Layouts adapt cleanly from desktop down to mobile.
Accessibility shaped the work throughout, with semantic structure, readable contrast, clear focus states, and a consistent header and footer so every page reads as one cohesive site.
The Build
Four pages, one cohesive site.
Use the arrows to move through the live pages.
Visual System
The brand I built on.
Color palette — earthy, organic
Warm, grounded tones from the brand book. Tints of each are allowed for flexibility.
Typography — Red Hat Display + Zilla Slab
Two Google Fonts: Red Hat Display for headings, Zilla Slab for body.
Built to Brief
Designed to a guide. Coded to standard.
Logo usage, palette, type, and accessibility, all carried from the brand book into a live responsive build.
View the Brand Style Guide