Kids Learning Centre
Children's education centre: colour-coded course cards, teachers, classrooms, trial class sign-up.
Install
npx shadcn@latest add "https://webberui.com/r/kids-learning-center.json?t=<install token>"The whole page lands in app/templates/kids-learning-center/. You can also use a long-lived licence key instead: set the Authorization: Bearer <key> header in the registries block of components.json — better for CI or a project several people share. What you may do with the source is in the licence terms.
Sections it ships with
Sections inside one template share the same design tokens, so swapping and reordering them keeps the colours, spacing and animation rhythm consistent. Pick and combine them in the section composer.
- 1
Navbar and Hero
A colourful collage hero carrying the brand navbar, tagline, two action buttons and three figures on the centre's track record.
hero - 2
Four Course Themes
Four colour-coded cards for the art, coding, music and movement courses, each with age range, focus and class times.
features - 3
Teaching Team
Four full-time teachers on dark cards, each with a teaching-philosophy quote and credential tags.
team - 4
The Space
A bento grid of the premises: soft-furnished classrooms, the reading corner, air-quality monitoring and the pick-up route.
gallery - 5
Parent Reviews
Four cards of first-hand parent feedback with five-star ratings, the child's age and the class they attend.
testimonial - 6
Trial Class Sign-Up
Copy on the left, form on the right: book a free trial class by course and time slot, with a success state after submitting.
form - 7
Footer
Dark footer with a brand blurb, quick links and contact details — address, phone and opening hours.
footer
What you get is source code
Not an npm package, not a zip file. Once installed, the page's TypeScript source sits in your repo: edit it however you like, no runtime dependency, no expiry mechanism. Your site keeps running even if ours goes down.
Browse the other 103 templates →