Tilt Info Cards is a premium layout component that arranges information cards and images in a visually striking fanned pattern. Each card tilts outward from center, creating dynamic depth that draws the eye across your content. Ideal for feature highlights, service overviews, team introductions, or any section where you need to present multiple pieces of content with editorial impact. Includes floating pill labels, connector lines, and call-to-action links on every card.
Alternating card and image panels arranged in a dynamic tilted fan.
Floating pill labels with subtle connector lines visually link category tags to their corresponding cards
Four built-in colour themes (Dark, Light, Midnight, Warm) plus a full Custom mode for complete brand control
Responsive CSS-percentage layout — panels scale proportionally to any container width without manual sizing
Smooth hover interactions with configurable lift distance, shadow intensity, and animation speed
Cards (array) — pill label, title, description, CTA text, and CTA link per card
Images (array) — upload images to interleave between cards
Tilt Angle — fan rotation per panel from center (0–12 degrees)
Overlap — control how much panels overlap each other (0–65%)
Theme — Dark, Light, Midnight, Warm, or Custom
Custom Colors — card background, title, description, CTA, pill background, pill text, pill border, and connector line colours
Border Radius
Padding
Shadow Intensity
Hover Lift distance
Speed (Fast, Medium, Slow)
Show Pills toggle
Show Connectors toggle
Show Images toggle
Title Font
Body Font
SaaS feature sections — present three to four core product capabilities with supporting images between each
Agency service pages — showcase service offerings with tilted cards and team or project photography
Portfolio highlights — fan out selected projects with descriptions and direct links
Landing page hero supplements — place below the fold as a visually rich content block that reinforces key selling points
Every card includes a call-to-action link with hover animation, turning your layout into a conversion-ready section — not just a visual.
We design and build custom Framer components. Get in touch at contact@teampixel.com.au.