Scalar UI
Marketing UIApp UIAIChartsBackgrounds
Sign inGet started
Scalar UI
Scalar UI© 2026 Scalar Limited

React · Tailwind CSS · Motion

Browse

HomeAll components 213

Collections

Marketing UI 107App UI 94AI 16Charts 45Backgrounds 2Text 43

More

Text 43

Marketing UI

Visuals 53Bento 1Hero 6Features 7Pricing 6Social Proof 16CTA & FAQ 9Headers & Footers 3Mockups 2Kit 3Landing pages 1

App UI

InstallationPrimitives 60Layouts 3Blocks 30Other 1

AI

Chat boxes 2Skill slots 1Power-ups 1Spark sliders 1Attachments 1Spark pulsars 1Typing & avatars 2Agent UI 1Personas 6

Charts

Bar chart 2Stacked bar 2Horizontal bar 2Line chart 3Area chart 3Spark chart 1Pie chart 2Donut & semi-donut 2Radial chart 1Hexagon chart 3Heatmap 2Funnel chart 3Category bar 2Segmented progress 1Scatter & bubble 2Combo chart 2Waterfall 2Diverging bar 2Candlestick 2Treemap 2Waffle chart 2Sankey 2

Resources

Docs & installScalar Design

All components

Marketing sections, AI pieces, charts, interactives, backgrounds and text effects. Preview live, copy when you’re signed in.

4 results for “heatmap”

4 results for “heatmap”

Sparkle Heatmap preview

Sparkle Heatmap

Chart

A grid shaded by value that cascades in diagonally, with a row-and-column crosshair on hover — an electrified dot grid with twinkling four-point sparks.

Bar City preview

Bar City

Section

An isometric city of bars, one block per value. Blocks spring up in a wave on view, then new data rolls in and every block springs to its new height. Point at a block to read it.

Contribution Heatmap preview

Contribution Heatmap

Section

A year of activity as a grid of days. Weeks pop in from left to right on view, today keeps ticking up and the total rolls. Point at any day to read it; left alone it visits the busiest days.

Gradient Heatmap preview

Gradient Heatmap

Chart

A grid shaded by value that cascades in diagonally, with a row-and-column crosshair on hover — soft gradient fills that fade into the floor.

AllMarketing UIApp UIAIChartsBackgroundsText