Components/sections

How It Works

Three-step process section with a line that draws between steps as they enter the viewport.

Free
1

Connect

Link your workspace in seconds, no config needed.

2

Customize

Tune the theme tokens to match your brand.

3

Launch

Ship a polished experience your users will love.

Usage: paste this file into your project (e.g. components/how-it-works.tsx), make sure framer-motion, clsx and tailwind-merge are installed, and add the cn() helper from the docs.