Trending Society

liquid-ring-layout | UI components | Trending Society

More from @liquid-charts, 43 components

All @liquid-charts

liquid-adapter-recharts component
@liquid-charts
Materials for Recharts: bars, areas, lines, composed charts, pies, donuts, radial bars, radar charts, treemaps, funnels, Sankey diagrams, scatter and bubble charts. The native charts' look on the Recharts charts you already have. Wrap the chart in <LiquidRecharts> and give each <Bar> shape={glassBar}, each <Area> {...liquidArea({ seriesKey })}, each <Line> shape={lightLine} and each <Pie> shape={glassPie}: they draw as glass bars, liquid areas, lines of light and glass rings, and the tooltip, type, grid, legend, brush and cursor take Liquid's chrome (chrome="host" keeps Recharts' own); the data, layout and keyboard stay the chart's.
Motion and effects8 registry deps · 1 package
liquid-adapter-recharts-core component
@liquid-charts
Materials for Recharts, the core: <LiquidRecharts>, its chrome, and glass bars, liquid areas, lines of light, composed charts, glass pies and donuts, radial bars and radar charts. The kinds shadcn's charts use; liquid-adapter-recharts adds treemaps, funnels, Sankey diagrams and scatter and bubble charts.
Motion and effects11 registry deps · 1 package
liquid-area-chart component
@liquid-charts
AreaChart: liquid areas for amounts over time (single, stacked, 100%, streamgraph, above or below a threshold), with the pour, the pointer ripple, range bands and projected stretches.
Data display4 registry deps
liquid-bands component
@liquid-charts
Liquid ribbons and flows.
Motion and effects2 registry deps
liquid-bar-chart component
@liquid-charts
BarChart: columns, rows, grouped, compare, stacked, 100%, diverging, highlights, targets as containers and engravings, and projected periods.
Data display3 registry deps
liquid-bar-layout component
@liquid-charts
The bar family's layout maths and stylesheet, which BarChart and the materials bridge draw with.
Motion and effects1 registry dep
liquid-beads component
@liquid-charts
Flat beads on a 2D canvas, and the labels that sit beside beads.
Motion and effects1 registry dep
liquid-bridge component
@liquid-charts
The materials bridge: the native charts' materials (glass bars, liquid areas, lines of light, glass rings) over a chart you already have, drawn from its own geometry. For bars, areas, lines, composed charts, pies, donuts, radial bars and radar charts; liquid-bridge-kinds adds treemaps, funnels, Sankey diagrams and scatter and bubble charts.
Motion and effects10 registry deps
liquid-bridge-kinds component
@liquid-charts
The materials bridge's tile, ribbon, dot and funnel kinds: glass tiles for treemaps, liquid ribbons for Sankey diagrams, glass beads for scatter and bubble charts, and the glass funnel, over a chart you already have.
Motion and effects9 registry deps
liquid-cells component
@liquid-charts
Heatmap, CalendarHeatmap, Waffle and UnitColumns: patterns across hours and places as liquid cells in their exact colour, and parts of a whole in units you can count.
Motion and effects5 registry deps
liquid-cells-material component
@liquid-charts
Liquid cells in their exact colour, and glass tiles.
Motion and effects3 registry deps
liquid-chart component
@liquid-charts
Accessible chart shell with a replaceable liquid rendering surface
Data display2 packages

liquid-ring-layout

Install

Live preview

Registry dependencies2

Packages0

liquid-ring-layout

Install

Live preview

Registry dependencies2

Packages0

Source

More from @liquid-charts, 43 components

The Signal

Install

Live preview

Registry dependencies2

Packages0

Install

Live preview

Registry dependencies2

Packages0

Source

More from @liquid-charts43, 43 components

More from @liquid-charts, 43 components