Does Features Sticky Scroll work with Next.js?

Yes. It is a React 19 component styled with Tailwind CSS 4, so it drops into a Next.js page, a Vite app, Remix or Astro.

Can I change the copy and colours?

Yes. The section is a file in your project. Text, links and images are plain props or JSX, and colours come from your theme's CSS variables, so a brand change is a token edit.

Features Sticky Scroll

A sticky list on the left lights up the step you are reading while visuals scroll past on the right.

Type: Features section
Styles: Dark, Futuristic
Licence: Charcoal UI Pro

About Features Sticky Scroll

Features Sticky keeps a list on the left that lights up the step you are reading while visuals scroll past on the right.

It is a full-width features section for React and Tailwind CSS 4, in a dark and futuristic style. Preview it at any width above, then install it with one command.

When to use Features Sticky Scroll

Step-by-step product walkthroughs.
How it works sections.
Developer onboarding.
Long-form product stories.

How it is built

An IntersectionObserver tracks the visible visual and highlights its step.

It has no component dependencies beyond the shared utilities, so it is one file to read and change.

Goes well with Features Sticky Scroll

Features Sticky Scroll is part of a full template, so you can see it in a finished page.

Kiln template: Ship-ready docs-first dev tool page.
Features Grid: A React features grid of six cards with a pointer spotlight and staggered reveal
Features Bento: A React bento features section where every tile is a working component
Features Alternating: A free React alternating features section: image and text rows that slide in
Features Tabs: React feature tabs that auto-advance with a progress bar and swap visuals

Install Features Sticky Scroll

npx shadcn@latest add @charcoal/features-sticky

Features Sticky Scroll is part of Charcoal UI Pro: one seat covers all 107 sections, 100 templates and 300 Pro components, for unlimited projects. The command installs the section into components/sections along with every component it uses.

Frequently asked questions

Does Features Sticky Scroll work with Next.js?: Yes. It is a React 19 component styled with Tailwind CSS 4, so it drops into a Next.js page, a Vite app, Remix or Astro.
Can I change the copy and colours?: Yes. The section is a file in your project. Text, links and images are plain props or JSX, and colours come from your theme's CSS variables, so a brand change is a token edit.

Features Sticky Scroll as Markdown