Does CTA Ember 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.

CTA Ember

A closing band with rising embers and a shimmering call to action.

Type: CTA section
Styles: Dark, Gradient
Licence: Charcoal UI Pro

About CTA Ember

CTA Ember closes a page with rising embers and a shimmering call to action, the last push before the footer.

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

When to use CTA Ember

End of landing pages.
Upgrade prompts.
Sign-up and trial calls to action.
Event registrations.

How it is built

Ember Field rises behind the copy and Shimmer Button carries the click.

It is composed from Ember Field, Shimmer Button, so installing it also installs those components, and you can restyle each one the same way you would on its own.

Goes well with CTA Ember

CTA Ember is part of 9 full templates, so you can see it in a finished page.

Ember template: An AI product site that glows.
Cinder template: Serious numbers, calmly presented.
Relay template: Status updates that write themselves.
Halcyon template: Support that answers in seconds.
Aperture template: Know what users do, and why.
Ledger template: Bookkeeping that reads like a newspaper.
Paperclip template: Get paid faster, freelancer.
Commons template: Bring your members home.
Relaunch template: Announce the big new version.
CTA Landscape: A React CTA card with a moonlit photo, metal headline and liquid-metal button
CTA Newsletter: A React newsletter CTA that validates inline and confirms with a drawn check
CTA Download: A React app download CTA with store buttons and a QR code for desktop
CTA Terminal: A developer React CTA with a copyable install command and a typing terminal
Ember Field: An animated React ember background: glowing embers drift up and flicker as they cool
Shimmer Button: An animated React shimmer button with an orbiting accent edge and a sweeping sheen

Install CTA Ember

npx shadcn@latest add @charcoal/cta-ember

CTA Ember 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 CTA Ember 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.

Built from

Ember Field: Canvas embers drifting up from the bottom edge, flickering as they cool. The Charcoal UI signature.
Shimmer Button: A charcoal pill with an ember edge that orbits the border and a sheen that sweeps across.

CTA Ember as Markdown