# First funnel

First funnel: a visitor walks the path, and each step's bar fills a little shorter.

- Theme: Interface
- Size: spot
- Access: Free
- Page: https://illos.dev/library/interface/first-funnel
- Preview image: https://media.illos.dev/previews/982065b7/flat/first-funnel.light.1600.webp
- SVG: https://illos.dev/assets/styles/flat/first-funnel.svg
- Add to a React project: `npx shadcn@latest add https://illos.dev/r/flat/first-funnel.json`

On the page, Copy gives the SVG and Download the file.

## How it moves

1. three steps sit on one path: a page, an event and a goal.
2. a visitor moves down the path, one step at a time.
3. each step's bar fills as they arrive, shorter at every step.

## Where it fits

For product analytics and growth tools: the funnels page before any funnel exists, a features card on conversion, or the docs page on building a funnel. One visitor walking a page, an event and a goal, with each bar filling shorter than the last, explains what a funnel measures before anyone has built one. As a spot it fits above the heading and a Create funnel button. It is free to copy and pairs with First goal, Analytics funnel and Requests chart.

Pairs well with: First goal (https://illos.dev/library/interface/first-goal.md), Analytics funnel (https://illos.dev/library/isometric/analytics.md), Requests chart (https://illos.dev/library/interface/requests-chart.md)

## Related

- [Interface illustrations](https://illos.dev/library/interface)
- [Free illustrations](https://illos.dev/library/free)
- [All illustrations](https://illos.dev/library)