Nodes stacked in columns by what flows through them, with ribbons revealed left to right; hovering a ribbon or node picks out its flows — soft gradient fills that fade into the floor.

Outlined Sankey Chart

Chart

Nodes stacked in columns by what flows through them, with ribbons revealed left to right; hovering a ribbon or node picks out its flows — hairline outlines over a faint tint.

React · Tailwind CSS · Motion

Browse

Home All components 213

Collections

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

Charts

Resources

Docs & install Scalar Design

Charts

Sankey

Flows between stages.

2 results

All Marketing UI App UI AI Charts Backgrounds Text

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

2 results

Gradient Sankey Chart

Chart

Nodes stacked in columns by what flows through them, with ribbons revealed left to right; hovering a ribbon or node picks out its flows — soft gradient fills that fade into the floor.

Outlined Sankey Chart

Chart

Nodes stacked in columns by what flows through them, with ribbons revealed left to right; hovering a ribbon or node picks out its flows — hairline outlines over a faint tint.

All Marketing UI App UI AI Charts Backgrounds Text