How It Works / Process
Step-by-step guides, timelines, and process flows
410 components - V3 300 free · V4 110 with a paid plan

How It Works Layout Style 1 49
steps + testimonial (success story) with divider above

How It Works Layout Style 2 49
steps + testimonial (success story) with image placeholder

How It Works Layout Style 3 49
steps + testimonial (success story) with icon accents

How It Works Layout Style 4 49
steps + testimonial (success story) centered layout

How It Works Layout Style 5 49
steps + testimonial (success story) left-aligned layout

How It Works Layout Style 6 49
steps + testimonial (success story) 2-column variant

How It Works Layout Style 1 50
steps + testimonial (success story) 3-column variant

How It Works Layout Style 2 50
steps + testimonial (success story) compact variant

How It Works Layout Style 3 50
steps + testimonial (success story) spacious variant with extra padding

How It Works Layout Style 4 50
steps + testimonial (success story) with social-icons row

How It Works Layout Style 5 50
steps + testimonial (success story) with counter stat

How It Works Layout Style 6 50
steps + testimonial (success story) full-width layout

How It Works with 3-step Process Grid
3-step process grid

How It Works with 4-step Process Grid
4-step process grid

Centered How It Works with Subtitle, Numbered, and 3 Steps
3-steps numbered h+sub no-CTA tight

Centered How It Works with Subtitle, Numbered, CTA, and 3 Steps
3-steps numbered h+sub CTA tight

Centered How It Works with Heading Only, Numbered, and 3 Steps
3-steps numbered h-only no-CTA tight

Centered How It Works with Heading Only, Numbered, CTA, and 3 Steps
3-steps numbered h-only CTA tight

Centered How It Works with Badge, Numbered, and 3 Steps
3-steps numbered badge no-CTA tight

Centered How It Works with Badge, Numbered, CTA, and 3 Steps
3-steps numbered badge CTA tight

Centered How It Works with Subtitle and 3 Steps
3-steps icon h+sub no-CTA tight

Centered How It Works with Subtitle, CTA, and 3 Steps
3-steps icon h+sub CTA tight

Centered How It Works with Heading Only and 3 Steps
3-steps icon h-only no-CTA tight

Centered How It Works with Heading Only, CTA, and 3 Steps
3-steps icon h-only CTA tight