Feature Grids
Browse our collection of feature grid layouts
Cinematic Stack
Sticky scroll feature grid with full-bleed cinematic image cards, Uilora-branded feature content, and smooth whileInView animations on a black background.
Elastic Expansion
Hover-to-expand accordion feature grid with image backgrounds, vertical labels on inactive panels, and Uilora-branded content on a light gray background.
Ethereal Minimal
Editorial 2-column photo grid with desaturated-to-color hover, serif italic headings, and Uilora-branded feature items on a white background.
Scatter Deck
Draggable card deck with Uilora-branded cards (Uilora, Motion, TypeScript, Design, 700+), spring physics, and a crosshair-grid background.
Uilora Hero Feature
Split hero feature section with gradient headline, CTA buttons, and 3 staggered feature cards — each with a pastel dot-grid background, iOS-style gradient icon, title and description.
Uilora Feature Trio
Centered feature section with large heading and three equal cards — each featuring a unique inline SVG illustration (shield, folder, component grid) on a light gradient background.
Uilora Phone Feature
Feature section with an iOS phone mockup (status bar, document editor, formatting options panel), 4 surrounding feature cards, floating '700' counter badge, floating checkmark badge, and a bottom fade-to-white effect.
Uilora Night Grid
Dark luxury bento grid on a near-black background. Features a hero card (col-span-2) with an animated constellation SVG and gradient border, plus 4 feature cards. Georgia serif headings with monospace accent labels.
Uilora Asym Grid
Clean asymmetric feature grid on a white background. One large left card with a big 700+ stat and animated mini-bento SVG illustration spans 3 rows, with 3 stacked feature cards on the right.
Uilora Glow Cards
Ultra-dark feature section with a large gradient '700+' headline stat and a 2×2 grid of glassmorphic cards. Each card has a unique per-card colored glow blob that intensifies on hover, plus an accent gradient top-border line.
