Independent K–8 school website template
Brookside Academy
A classic, trustworthy template for independent schools, academies and learning centres. Navy and crimson with a scholarly serif, it carries a programs page by division, a daily schedule, tuition tiers with a financial aid FAQ, admissions steps and a news section, all written for parents comparing schools.
$19$49
one-time, no subscription
Instant download · 7-day refund before first download
Every page, finished
9 pages · 40 sections · 18 photos
Design system
- Display face
- Crimson Pro
- Body face
- Nunito Sans
- Header · footer · images
- utility · columns · rounded
- paper
#FFFFFF - surface
#F3F5F9 - ink
#0F2142 - muted
#56637A - line
#DFE4EE - brand
#0F2142 - brandInk
#FFFFFF - accent
#C8102E
What’s inside
- Next.js 16 project — App Router, static export, TypeScript
- Astro 7 project — same components as .astro files
- Plain HTML — compiled Tailwind CSS, open index.html
- 18 photos as WebP at 1600px and 800px, plus the prompts
- All copy in one site.json — names, prices, hours, posts
- Working contact form markup (Formspree-ready) and thank-you page
- SEO titles, descriptions and Open Graph tags on every page
Sections used
- Centered hero
- Stats
- Feature grid
- Image + text
- Testimonials
- Timetable
- Article grid
- Call to action
- Page header
- Story
- Timeline
- Team
- Logo strip
- Service list
- Pricing tiers
- Process steps
- FAQ
- Contact form + details
- Info bar
- Newsletter
- Article layout
Next.js 16
App Router · static export
Astro 7
Components + content JSON
Tailwind 4
Theme as CSS variables
HTML
Compiled CSS, no build
About the independent k–8 school template
Is this template only for K–8 schools?
No. Rename the divisions and it works for preschools, high schools, Montessori schools, tutoring centres and language schools.
Can I show tuition without listing a price?
Yes. Change the price field to 'Contact us' or a range, and lean on the financial aid FAQ to explain your approach.
How should I handle photos of students?
The image direction favours wide shots, hands-on work and children seen from behind, which respects families who opt out of media release.
Can I use it for a client?
Yes — unlimited personal and client projects. You just can’t resell the template itself.
How do I change the business name, colours and photos?
Edit site.json for words and images; change the eight colour variables and two font names at the top of global.css. Every page follows.
Building for this industry? Read the school website template guide.










