UIKit Template
Component Docs
Interactive demos and style references for every component in this template.
- Foundation
Style Guide
Colors, typography, grids, cards, buttons, spacers, UIkit utility classes.
- Foundation
Design Tokens
Every CSS variable: color, spacing, radius, typography scales. Check here before inventing a new token.
- Architecture
Shared Inner Pages
One demo, several homepages, one set of inner pages. How the variant routing is wired and how to add another homepage.
- Assets
Image Generator
Generating demo imagery with Gemini: the API key, the manifest, the five scripts, and the rules that keep breaking.
- Animation
GSAP
Scroll-triggered animations: split text, parallax, panel scroll, zoom grid.
- Slider
Swiper
Slider variants: classic grid, scale active, sync, tabs, fashion, material you.
- Gallery
Fancybox
Gallery & popup components: autoscroll carousel, thumbs, booking gallery, HTML popup.
- UI
UIKit Components
Reusable React components: UkNavbar, UkBreadcrumb, UkInsideHeader, and more.
- Heroes
Headers
Copy-paste hero sections by layout family: full-width, grid, and more.
- Patterns
Snippets
Copy-paste patterns: buttons, lists, cards, forms, layouts.
- Tooltips
Tippy.js
Rich-content tooltips: HTML, images, interactive elements.
- Search
Algolia
Real-time autocomplete over the site index: Fuse.js fuzzy match, RTL, keyboard nav.