# Obsyde UI > Obsyde UI is a collection of React components, charts and effects: plain React, TypeScript and CSS with no runtime dependencies, installed as source with the shadcn CLI. Dark, monochrome at rest, one accent for what is live. - Install a free piece: `npx shadcn@latest add https://obsydeui.com/r/.json`. Pro pieces: `npx shadcn@latest add @obsyde/` with the registry set up (https://obsydeui.com/docs/pro.md). - Every page has a Markdown twin: add `.md` to its URL. Everything in one file: https://obsydeui.com/llms-full.txt. - Files install under components/obsyde/ and import each other by relative path; change a piece through its props and its own CSS. ## Docs - [Introduction](https://obsydeui.com/docs.md): What Obsyde UI is, what you get, and how a piece gets into your project. - [Installation](https://obsydeui.com/docs/installation.md): Add a piece with the shadcn CLI, or by hand. Requirements, where files land, and what comes with them. - [Pro and the CLI](https://obsydeui.com/docs/pro.md): Install Pro pieces with your licence key, in your project, in CI and with your team. ## Guides - [Theming](https://obsydeui.com/docs/theming.md): Accents, the design tokens behind every piece, and how to change them. - [AI agents](https://obsydeui.com/docs/ai.md): Everything an AI coding agent needs to find, install and use Obsyde UI pieces. ## Components - [Fuse Button](https://obsydeui.com/components/fuse-button.md): Hold to confirm. (Pro) - [Trace Input](https://obsydeui.com/components/trace-input.md): A text field whose border is traced round it from the point you clicked (left-centre from the keyboard), joining on the far side. (Pro) - [Inplace Select](https://obsydeui.com/components/inplace-select.md): A dropdown that opens over itself: the selected option stays under the cursor and the list unfolds around it, then collapses into the trigger with the chosen row travelling into place. (Pro) - [Detent Slider](https://obsydeui.com/components/detent-slider.md): A slider on a ruler. (Pro) - [Heat Haze](https://obsydeui.com/components/heat-haze.md): Wraps any element and heats the air above it. (Pro) - [Molten Edge](https://obsydeui.com/components/molten-edge.md): A border that behaves like a metal wire. (Pro) - [Dither Reveal](https://obsydeui.com/components/dither-reveal.md): Content appears and disappears through an ordered-dither threshold: hard square cells, one bit, no opacity fade. (Pro) - [Filings](https://obsydeui.com/components/filings.md): A background field of short strokes that behave like iron filings. (Pro) - [Button](https://obsydeui.com/components/button.md): The base button, pressed like a key into a warm surface. (Free) - [Icon Button](https://obsydeui.com/components/icon-button.md): A square button for one icon, ghost at rest. (Free) - [Copy Button](https://obsydeui.com/components/copy-button.md): Copies a value and proves it: the copy icon gives way to a check that draws itself in the accent, and a soft light passes once over the value. (Free) - [Switch](https://obsydeui.com/components/switch.md): A switch that feels like a small physical toggle. (Free) - [Checkbox](https://obsydeui.com/components/checkbox.md): An 18px filled box that turns bone and draws its check; unchecking stays quiet. (Free) - [Radio Group](https://obsydeui.com/components/radio-group.md): One dot for the whole group. (Pro) - [Segmented Control](https://obsydeui.com/components/segmented.md): A recessed, borderless well with one raised thumb that glides between segments on a softly settling spring; labels brighten as the thumb passes under them. (Pro) - [Kbd](https://obsydeui.com/components/kbd.md): Key caps that go down when you press the real keys: the cap drops a pixel, its bottom edge collapses and the legend takes the accent, then it springs back and cools on release. (Free) - [Textarea](https://obsydeui.com/components/textarea.md): A textarea that grows with its content on a spring and shows its budget as a short meter beside a rolling counter in the help row: bone while there is room, accent in the last tenth, error past the limit; going over is marked invalid but never blocked. (Free) - [Number Input](https://obsydeui.com/components/number-input.md): A number you can type, step or drag. (Pro) - [Pin Input](https://obsydeui.com/components/pin-input.md): A one-time code field: one real input drives every cell, so paste, autofill and mobile keyboards just work. (Pro) - [Search Input](https://obsydeui.com/components/search-input.md): A search field with a keyboard shortcut cap that becomes a clear button once there is text. (Free) - [Password Input](https://obsydeui.com/components/password-input.md): A password field whose strength reads as temperature: four segments light left to right from deep to accent to hot to white. (Pro) - [Tag Input](https://obsydeui.com/components/tag-input.md): A field that turns text into tags. (Pro) - [Combobox](https://obsydeui.com/components/combobox.md): A select you can type into. (Pro) - [File Drop](https://obsydeui.com/components/file-drop.md): A recessed drop zone with no outline at rest; while files hover it lifts, warms and shows a dashed outline that flows inward. (Pro) - [Range Slider](https://obsydeui.com/components/range-slider.md): Two thumbs on a rail that behave like physical objects: they push each other along instead of crossing, the span between them drags both, and they settle onto the step when released. (Pro) - [Date Picker](https://obsydeui.com/components/date-picker.md): A date field with a calendar popup. (Pro) - [Tabs](https://obsydeui.com/components/tabs.md): Text tabs with one raised, borderless fill that slides to the active tab on springs, stretching a little in flight; panels cross over and the height follows. (Free) - [Accordion](https://obsydeui.com/components/accordion.md): Rows whose panels spring open to their measured height. (Free) - [Pagination](https://obsydeui.com/components/pagination.md): Page numbers in fixed slots, so the control never changes width. (Pro) - [Stepper](https://obsydeui.com/components/stepper.md): Progress through steps. (Pro) - [Side Nav](https://obsydeui.com/components/side-nav.md): An app sidebar: a workspace switcher, search, labelled and collapsible sections, nested rows, badges and dots. (Pro) - [Tree](https://obsydeui.com/components/tree.md): A nested tree with indent guides. (Pro) - [Scroll Area](https://obsydeui.com/components/scroll-area.md): A native scroller with its own scrollbar out of the way: a 2px line that shows while scrolling, widens when the pointer reaches for it and fades once you stop. (Pro) - [Tooltip](https://obsydeui.com/components/tooltip.md): Tooltips that warm up. (Free) - [Popover](https://obsydeui.com/components/popover.md): A click-opened surface with no arrow: it grows out of the trigger's centre and stays on screen as it shifts. (Pro) - [Dialog](https://obsydeui.com/components/dialog.md): A confirm dialog that rises 8px into place. (Pro) - [Drawer](https://obsydeui.com/components/drawer.md): A side sheet you can throw. (Pro) - [Callout](https://obsydeui.com/components/callout.md): A quiet inline note on a tinted fill: neutral, a warm accent wash, or the error tint, with an optional small action button. (Pro) - [Toast](https://obsydeui.com/components/toast.md): Toasts whose remaining life is a faint lift of the card's own surface, receding as the time runs down; an action is a small filled button. (Pro) - [Menu](https://obsydeui.com/components/menu.md): A dropdown or context menu with one highlight that slides between rows, submenus that open on hover intent (a diagonal toward them does not close them), checkbox items, and a brief lift of the chosen row. (Pro) - [Command Palette](https://obsydeui.com/components/command-palette.md): A command palette where nothing jumps: as you type, rows that stay glide to their new rank, rows that leave fade and collapse, rows that arrive fade in. (Pro) - [Table](https://obsydeui.com/components/table.md): A data table whose rows glide to their new places when you sort. (Pro) - [Progress](https://obsydeui.com/components/progress.md): A bone fill on a faint track. (Free) - [Spinner](https://obsydeui.com/components/spinner.md): A faint ring with a comet running round it, its tail a true fade from deep to hot. (Free) - [Skeleton](https://obsydeui.com/components/skeleton.md): 6s on one page-wide clock. (Free) - [Status](https://obsydeui.com/components/status.md): A dot and a word, no pill. (Free) - [Smoulder Text](https://obsydeui.com/components/smoulder-text.md): Text that catches where the pointer passes and cools behind it. (Pro) - [Filament Text](https://obsydeui.com/components/filament-text.md): Type that switches on like a filament. (Pro) - [Decode Text](https://obsydeui.com/components/decode-text.md): Text that resolves out of noise, left to right, at a stepped 30 frames per second. (Free) - [Ticker](https://obsydeui.com/components/ticker.md): A large counter with the feel of a mechanical odometer at speed. (Pro) - [Thermal](https://obsydeui.com/components/thermal.md): A surface that remembers where the pointer has been, seen through a 1-bit thermal camera. (Pro) - [Hotplate](https://obsydeui.com/components/hotplate.md): A perfectly regular dot grid that swells and heats under the pointer and rings when struck. (Pro) - [Cinder](https://obsydeui.com/components/cinder.md): A transition where content burns away along an organic edge. (Pro) - [Convection](https://obsydeui.com/components/convection.md): A background of rising heat drawn only as contour lines. (Pro) - [Tilt](https://obsydeui.com/components/tilt.md): A card that leans toward the pointer on a loose spring, overshooting slightly and settling, with a highlight that travels round its 1px edge like light on a bevel. (Pro) - [Footer](https://obsydeui.com/components/footer.md): A closing section for the foot of a page. (Pro) - [Avatar](https://obsydeui.com/components/avatar.md): Initials on a filled graphite surface with a soft top light and fine grain, or one of three seeded monochrome faces: glow (soft pools of light in smoke), contour (fine topographic lines) and eclipse (a crescent of rim light). (Free) - [Breadcrumbs](https://obsydeui.com/components/breadcrumbs.md): A path of crumbs split by thin slashes, the current page in full text colour and not a link. (Free) - [Carousel](https://obsydeui.com/components/carousel.md): A track of slides you throw with a finger, a mouse or a trackpad: the release velocity picks the slide and the snap carries it on a spring, and past either end the track stretches like rubber. (Pro) - [Resizable](https://obsydeui.com/components/resizable.md): Two panes split by a 1px hairline with a small grip. (Pro) - [Color Picker](https://obsydeui.com/components/color-picker.md): A saturation and brightness square, a hue strip and a mono hex field, controlled by one hex value. (Pro) - [Spotlight Grid](https://obsydeui.com/components/spotlight-grid.md): A grid of dark tiles that share one light. (Pro) - [Sparks](https://obsydeui.com/components/sparks.md): A background of 1–2px sparks that rise from the bottom edge, cooling from hot to deep as they climb and dying out partway up. (Pro) - [Magnet](https://obsydeui.com/components/magnet.md): A wrapper that pulls its child toward the pointer once it comes within a radius of the child's edge, on a loose spring, growing slightly as it is drawn in. (Pro) - [Beam](https://obsydeui.com/components/beam.md): Hairline curves drawn between nodes, measured from the elements themselves and re-measured when anything resizes. (Pro) - [Dot Matrix](https://obsydeui.com/components/dot-matrix.md): Text on an LED panel: a 5×7 bitmap font drawn on a canvas of faint unlit dots, with lit dots in bone. (Pro) - [Flame Wrap](https://obsydeui.com/components/flame-wrap.md): Wraps any element in a border of fire. (Pro) - [Blaze](https://obsydeui.com/components/blaze.md): Fire along the bottom edge of a container. (Pro) - [Frost](https://obsydeui.com/components/frost.md): A pane of hoarfrost over live content. (Pro) - [Metal](https://obsydeui.com/components/metal.md): Liquid dark chrome for small controls. (Pro) - [Border Beam](https://obsydeui.com/components/border-beam.md): A soft light that travels the rim of a card, button or field and spills onto its surface, as if the edge were glass catching a passing light. (Pro) - [Smoke](https://obsydeui.com/components/smoke.md): Soft smoke on a 2D canvas: pooled sprites drifting on curl noise, laminar at the source and curling as they rise. (Pro) - [Wake Slider](https://obsydeui.com/components/wake-slider.md): A range drawn as a row of thin bars, with no thumb: bone to the left of the value, faint to the right. (Pro) - [Signature Pad](https://obsydeui.com/components/signature-pad.md): A pad you sign with a mouse, pen or finger. (Pro) - [Slosh Slider](https://obsydeui.com/components/slosh-slider.md): A slider whose fill is a liquid. (Pro) - [Goo Toggle](https://obsydeui.com/components/goo-toggle.md): A switch whose knob travels like viscous molten metal. (Pro) - [Rotary Knob](https://obsydeui.com/components/rotary-knob.md): A knob you turn by dragging up and down on the cap or round the ring. (Pro) - [Slide to Confirm](https://obsydeui.com/components/slide-confirm.md): Drag a hot slug along a recessed channel and the channel heats behind it: a soft accent bloom trails the knob and fades to nothing, and the knob warms as it nears the end. (Pro) - [Navbar](https://obsydeui.com/components/navbar.md): A floating pill header: wordmark, links, one action. (Pro) - [Hero](https://obsydeui.com/components/hero.md): An opening section: a meta line, a big headline, a subline and two actions, centred or set left over a live background slot. (Pro) - [Pricing](https://obsydeui.com/components/pricing.md): Two or three plans side by side, stacked when narrow. (Pro) - [Feature Grid](https://obsydeui.com/components/feature-grid.md): A bento of feature tiles under one light. (Pro) - [FAQ](https://obsydeui.com/components/faq.md): Questions and answers in two columns: the heading on the left, held in place while the list scrolls; the questions on the right. (Free) - [Signup](https://obsydeui.com/components/signup.md): A closing section: a headline, a line, and one email pill with its button inside. (Pro) - [Dock](https://obsydeui.com/components/dock.md): A row of drawn icon tiles that swell toward the pointer: each tile rides its own spring toward a cosine falloff of its distance from the hand, so the row grows around it and settles back when it leaves. (Pro) - [Card Stack](https://obsydeui.com/components/card-stack.md): A deck you throw from the top. (Pro) - [Context Meter](https://obsydeui.com/components/context-meter.md): One thin bar for how much of a capacity is used, split into segments in grey steps with the remainder faint. (Pro) - [Dynamic Island](https://obsydeui.com/components/dynamic-island.md): A black pill that changes shape with what it is showing: compact, expanded with content, or split into two bubbles. (Pro) - [Morph Card](https://obsydeui.com/components/morph-card.md): Small cards that open in place into a large panel. (Pro) - [Sortable List](https://obsydeui.com/components/sortable-list.md): Rows you drag into a new order. (Free) - [ASCII Wake](https://obsydeui.com/components/ascii-wake.md): A field of Geist Mono characters that sits at rest as faint centred periods. (Pro) - [Shockwave](https://obsydeui.com/components/shockwave.md): A taut surface you can hit. (Pro) - [Particle Text](https://obsydeui.com/components/particle-text.md): Type sampled into a couple of thousand square particles of bone ash. (Pro) - [Molten Text](https://obsydeui.com/components/molten-text.md): Display type filled with slowly flowing metal. (Pro) - [Marquee](https://obsydeui.com/components/marquee.md): An endless horizontal loop of any content, repeated as many times as the width needs so the seam never shows, with both edges faded by a mask. (Free) - [Scroll Reveal Text](https://obsydeui.com/components/scroll-reveal-text.md): A paragraph that lights word by word as it scrolls through the viewport, from a faint grey to bone. (Pro) - [Split Flap](https://obsydeui.com/components/split-flap.md): A Solari board. (Pro) - [Roadmap Timeline](https://obsydeui.com/components/roadmap.md): An editable project roadmap: a collapsible list of phases, tasks and milestones beside a time canvas that pans and zooms smoothly around the pointer from days to quarters. (Pro) - [Flow Canvas](https://obsydeui.com/components/flow-canvas.md): A node-based workflow editor on an infinite dot grid. (Pro) - [Kanban Board](https://obsydeui.com/components/kanban.md): A task board you can pick cards up from. (Pro) - [Calendar](https://obsydeui.com/components/calendar.md): A full scheduling calendar with Day, Week, Month and Agenda views. (Pro) - [Data Grid](https://obsydeui.com/components/data-grid.md): A spreadsheet-grade grid that stays smooth at 100,000 rows: virtualised body under a sticky header and a frozen first column. (Pro) - [Bento Showcase](https://obsydeui.com/components/bento.md): An asymmetric bento whose cells run small live pieces: a chart that takes a point each second, a switch you can flip, a counter that rolls, a code snippet a passing pointer sweeps light across, and a build status that moves on. (Pro) - [Testimonial Wall](https://obsydeui.com/components/testimonials.md): A masonry wall of quotes in three or four columns, each a seamless loop drifting slowly, alternate columns in opposite directions. (Pro) - [Diff Viewer](https://obsydeui.com/components/diff-viewer.md): A code review diff that morphs between split and unified on one spring: every line glides to its new place and width, numbers fold into a single gutter, padding fills fade. (Pro) - [Gantt](https://obsydeui.com/components/gantt.md): A project timeline you work by hand. (Pro) - [Changelog](https://obsydeui.com/components/changelog.md): Release notes with a version rail held beside them. (Pro) - [Comparison Table](https://obsydeui.com/components/comparison.md): Plans side by side, feature by feature, on filled rows in alternate bands with no borders. (Pro) - [Terminal](https://obsydeui.com/components/terminal.md): A scripted terminal session with a real hand on the keys: commands type at a human cadence (quick runs, a beat between words, the odd typo backspaced), then output streams in, a progress bar redrawn in place, braille spinners, a build table, test passes in the accent and failures in red. (Pro) - [Glass Lens](https://obsydeui.com/components/glass-lens.md): A pane of glass you can pick up, drawn in WebGL. (Pro) - [Rich Text Editor](https://obsydeui.com/components/rich-text.md): A writing surface on plain contenteditable, no editor library. (Pro) - [Shard Rating](https://obsydeui.com/components/shard-rating.md): A rating input whose glyphs are cut glass. (Pro) - [Reaction Bar](https://obsydeui.com/components/reaction-bar.md): Chat reactions with rolling counts, a searchable picker and super reactions: a warm chip of their own, sent from the picker's Super toggle or by pressing and holding a chip, with a short burst of floating copies. (Pro) - [Hotkey Recorder](https://obsydeui.com/components/hotkey-recorder.md): A field that records a keyboard shortcut. (Pro) - [Notification Inbox](https://obsydeui.com/components/inbox.md): A bell with an inbox behind it. (Pro) - [Profile Peek](https://obsydeui.com/components/profile-peek.md): A profile card that grows from its mention, carrying the avatar and name into place, then glides between people without closing. (Pro) - [Onboarding Checklist](https://obsydeui.com/components/onboarding-checklist.md): A workspace checklist with drawing checks, a spring progress ring, asynchronous actions and a shared-surface collapse into a completion pill. (Pro) - [Before / After](https://obsydeui.com/components/before-after.md): Two crisp DOM layers divided by a spring-driven heat seam, with pointer momentum, round falling sparks and keyboard control. (Pro) - [Presence](https://obsydeui.com/components/presence.md): A live avatar stack that fans on a spring, a people popover, and data-driven remote cursors with click ripples and idle fading. (Pro) - [Waveform Player](https://obsydeui.com/components/waveform-player.md): A real WebAudio player for a deterministic forty-second synthesized clip, with a DPR waveform, heat-following playhead, chapters, scrubbing, speed and volume. (Pro) - [Guided Tour](https://obsydeui.com/components/guided-tour.md): A product tour with a spring-morphing SVG spotlight, a following coach mark, interactive targets, keyboard navigation and focus restoration. (Pro) ## Charts - [Pulse Line](https://obsydeui.com/charts/pulse-line.md): A live line whose newest point is the only hot thing on screen. (Pro) - [Scrub Bars](https://obsydeui.com/charts/scrub-bars.md): A bar chart you read by dragging across it. (Pro) - [Sparkline](https://obsydeui.com/charts/sparkline.md): A word-sized line, area or bar run that sits on the text baseline with its latest value beside it, the newest point a hot dot and the low and high marked by 3px ticks. (Pro) - [Gauge](https://obsydeui.com/charts/gauge.md): A dial of 61 notches with a needle that has mass: it sweeps up from the minimum on a loose spring, overshoots and settles, lighting notches as it passes and flashing the one it just crossed. (Pro) - [Heat Grid](https://obsydeui.com/charts/heat-grid.md): Seven days by N weeks of cells in five quiet bone levels. (Pro) - [Strata](https://obsydeui.com/charts/strata.md): A stacked area chart you can take apart. (Pro) - [Area Chart](https://obsydeui.com/charts/area-chart.md): A smooth line over a surface that fades to nothing beneath it. (Pro) - [Bar Chart](https://obsydeui.com/charts/bar-chart.md): Vertical bars on the viz-kit chart: single, grouped or stacked, morphing between layouts bar by bar on staggered springs. (Pro) - [Line Chart](https://obsydeui.com/charts/line-chart.md): Up to six series drawn in greys of different strength, never a rainbow. (Pro) - [Donut Chart](https://obsydeui.com/charts/donut-chart.md): Ring segments in grey steps, cut apart by 2px gaps, that sweep on clockwise on the shared reveal curve. (Pro) - [Radar Chart](https://obsydeui.com/charts/radar-chart.md): A web of hairline rings and spokes holding up to four series polygons. (Pro) - [Bar List](https://obsydeui.com/charts/bar-list.md): A ranked list of horizontal bars with each value in mono on the right. (Free) - [Scatter Plot](https://obsydeui.com/charts/scatter-plot.md): Points on the viz-kit chart with a free pointer. (Pro) - [Radial Bars](https://obsydeui.com/charts/radial-bars.md): Two to five concentric arcs on faint tracks, read clockwise. (Pro) - [Metric](https://obsydeui.com/charts/metric.md): A label, one big number and its change. (Pro) - [Histogram Range](https://obsydeui.com/charts/histogram-range.md): A distribution with a two-thumb range slider fused to its baseline. (Pro) - [Candlestick](https://obsydeui.com/charts/candlestick.md): Open, high, low and close per period: rising candles green, falling ones red, or a monochrome tape (hollow bone rising, solid grey falling) where the candle under your pointer heats in the accent. (Pro) - [Treemap](https://obsydeui.com/charts/treemap.md): A squarified treemap with 2px gaps, each cell a grey step by its value. (Pro) - [Ridgeline](https://obsydeui.com/charts/ridgeline.md): Density curves stacked like a range of hills: each ridge is a stage-black fill with a bone top line, so nearer ridges hide the ones behind. (Pro) - [Bump Chart](https://obsydeui.com/charts/bump-chart.md): Rank over time as smooth S-curves between rank positions, with each series named at its right end. (Pro) - [Radial Histogram](https://obsydeui.com/charts/radial-histogram.md): A day around a dial, drawn as a radial instrument: a tight tick ring just outside the hole, hour labels well outside the values, faint value rings, and bins that glow outward (dim at the root, full strength at the tip) as arc bars or columns of dots at even density. (Pro) - [Dumbbell](https://obsydeui.com/charts/dumbbell.md): A before and an after value per row: a hollow ring, a solid dot and the link between them. (Pro) - [Bullet Chart](https://obsydeui.com/charts/bullet-chart.md): One measure against its target per row: three quiet bands for the qualitative ranges, a thin bone bar for the measure and a bone tick for the target; only the part past the target runs hot. (Free) - [Sankey](https://obsydeui.com/charts/sankey.md): Flows between columns of thin bone bars, carried by ribbons that run as gradients from the source's grey to the target's. (Pro) - [Network Graph](https://obsydeui.com/charts/network-graph.md): A force-directed graph on one canvas that cools to rest: nodes sized by their links under a soft top light, gently arced links that fade with length and weight, and a faint filled blob behind each group. (Pro) - [Waffle](https://obsydeui.com/charts/waffle.md): A hundred small cells showing a share of 100. (Pro) - [Box Plot](https://obsydeui.com/charts/box-plot.md): 5 IQR and hollow rings for the outliers past them, on the viz-kit chart. (Pro) - [Sunburst](https://obsydeui.com/charts/sunburst.md): A hierarchy as rings around a centre, one grey step per depth, cut apart by 2px gaps, sweeping on clockwise. (Pro) - [Small Multiples](https://obsydeui.com/charts/small-multiples.md): A grid of tiny charts that share one crosshair. (Pro) - [Chart Tooltip](https://obsydeui.com/charts/chart-tooltip.md): The tooltip and crosshair kit on real charts. (Pro) - [Chart Legend](https://obsydeui.com/charts/chart-legend.md): Every legend layout from the chart kit, wired to real charts through one focus store. (Pro) - [Chart Patterns](https://obsydeui.com/charts/chart-patterns.md): Single-colour textures for charts, on a 6px base tile so lines and dots land on whole pixels and stay crisp at any pixel density. (Pro) - [Chart Annotations](https://obsydeui.com/charts/chart-annotations.md): The chart kit layers that explain data, each on a real chart. (Pro) - [Chart States](https://obsydeui.com/charts/chart-states.md): Loading, empty and ready on one chart instance, crossfading without a remount. (Pro) - [Live Line](https://obsydeui.com/charts/live-line.md): A streaming line that never ticks. (Pro) - [Violin](https://obsydeui.com/charts/violin.md): Kernel-density violins per group: each body is the distribution's shape mirrored about its axis, with a box inside (IQR bar, whiskers, a punched-out median) or dashed quartile rules, and an optional strip of the raw samples. (Pro) - [Tick Ring](https://obsydeui.com/charts/tick-ring.md): A donut drawn as fine radial ticks. (Pro) - [Lollipop](https://obsydeui.com/charts/lollipop.md): One row per category: a hairline stem that fades in from the baseline and a head at the value, as a dot, a ring or a squircle. (Pro) - [Density Plot](https://obsydeui.com/charts/density-plot.md): Smooth kernel-density curves, overlaid on one baseline or stacked as ridges that occlude the row behind. (Pro) - [Radial Clock](https://obsydeui.com/charts/radial-clock.md): A day wrapped round a dial. (Pro) - [Step Line](https://obsydeui.com/charts/step-line.md): Honest steps for tiers, plans and prices: values that hold until they change. (Pro) - [Profit / Loss Line](https://obsydeui.com/charts/profit-loss-line.md): One line split exactly at zero. (Pro) - [Range Band](https://obsydeui.com/charts/range-band.md): A line inside its envelope: min–max, a confidence interval, or Bollinger bands (a moving average ± kσ). (Pro) - [Funnel](https://obsydeui.com/charts/funnel.md): Stages as one stream that narrows from step to step. (Pro) - [Range Bars](https://obsydeui.com/charts/range-bars.md): Floating bars, one per row, from a start to an end, with a capsule tick for the current value. (Pro) - [Unit Dots](https://obsydeui.com/charts/unit-dots.md): A unit chart: every period is a column of equal-value squares, so one square is always the same amount and nothing can be exaggerated. (Pro) - [Timeline Bars](https://obsydeui.com/charts/timeline-bars.md): Events on a week track where a bar's width is its duration, one lane per kind. (Pro) - [Barcode Stack](https://obsydeui.com/charts/barcode-stack.md): A category breakdown drawn as a stacked progress bar of hairlines. (Pro) - [Radial Line](https://obsydeui.com/charts/radial-line.md): Today as an open line round a 24-hour dial, ending in a pulsing dot at now, against yesterday’s dashed full loop on the same scale, inside an instrument tick ring and faint value rings. (Pro) - [Circle Pack](https://obsydeui.com/charts/circle-pack.md): A hierarchy as nested circles, packed tight with an even gap between siblings and a clear inset inside each parent. (Pro) - [Year Loop](https://obsydeui.com/charts/year-loop.md): A year wrapped into a loop. (Pro) - [Beeswarm](https://obsydeui.com/charts/beeswarm.md): A deterministic swarm plot: every sample is a dot on the value axis, nudged up or down just enough not to touch its neighbours, so the outline of each swarm is the distribution and every point can still be pointed at. (Pro) - [Waterfall](https://obsydeui.com/charts/waterfall.md): A start, the steps up and down, subtotals and the end. (Pro) - [Ribbon Chart](https://obsydeui.com/charts/ribbon-chart.md): Stacked bars per period, re-ranked every period with the leader on top, joined by flowing ribbons that carry each series from one period to the next. (Pro) - [Bubble Chart](https://obsydeui.com/charts/bubble-chart.md): Bubbles for x, y, size and category: area encodes size on a square-root scale and each category is a step on the grey ladder. (Pro) - [Forecast Handoff](https://obsydeui.com/charts/forecast-handoff.md): Measured bars hand off to a dashed forecast at a "today" divider. (Pro) - [Streamgraph](https://obsydeui.com/charts/streamgraph.md): Smooth stacked streams around a moving centre (wiggle), a symmetric silhouette, a zero baseline or shares of 100%. (Pro) - [Pareto](https://obsydeui.com/charts/pareto.md): Causes sorted largest first as bars, with the cumulative share as a line on a 0 to 100% axis. (Pro) - [Ring Stack](https://obsydeui.com/charts/ring-stack.md): Concentric ring bars on a semicircle, a 270° horseshoe or a full circle: one ring per group, its parts stacked end to end along the arc over a faint track that stands for what is left, with percent ticks along the outside. (Pro) - [Half Donut](https://obsydeui.com/charts/half-donut.md): A segmented half ring for a budget or a quota. (Pro) - [Hexbin](https://obsydeui.com/charts/hexbin.md): A few thousand points binned into hexagons and drawn on a canvas, with SVG axes, keyboard and states on top. (Pro) - [Chord Diagram](https://obsydeui.com/charts/chord-diagram.md): Flows between groups around a circle. (Pro) - [Rose Chart](https://obsydeui.com/charts/rose-chart.md): A polar area chart in the Nightingale manner: one wedge per category, stacked by series, its radius on a square-root scale so the area tells the truth, cut apart by a constant-width gap. (Pro) - [Diverging Bars](https://obsydeui.com/charts/diverging-bars.md): Bars grow away from a highlighted midline, up and down or left and right. (Pro) - [Calendar Heatmap](https://obsydeui.com/charts/calendar-heatmap.md): A year of days as a dot calendar: round or square cells in week columns, quarters set apart by a gap with a hairline that fades at both ends, single-letter day labels, months and quarters above, and future days left as faint empties. (Pro) - [Arc Diagram](https://obsydeui.com/charts/arc-diagram.md): Nodes on one line and their links as arcs above it, each as thick as its weight. (Pro) - [Unit Columns](https://obsydeui.com/charts/unit-columns.md): Columns counted out in rounded squares, one per unit, over a faded hatched track that shows how far the scale goes. (Pro) - [Radial Stack](https://obsydeui.com/charts/radial-stack.md): Stacked bars standing out from a ring, one per category, sorted by total so the dial reads as a spiral from the largest at 12 o’clock round to the smallest. (Pro) - [Punch Card](https://obsydeui.com/charts/punch-card.md): Day by hour as a grid of dots sized, and optionally shaded up the grey ladder, by value, so the busy hours of the week read at a glance and empty slots stay as pinpricks. (Pro) - [Parallel Coordinates](https://obsydeui.com/charts/parallel-coordinates.md): One vertical axis per dimension and one line per record, coloured by class in the grey ladder. (Pro) - [Horizon Chart](https://obsydeui.com/charts/horizon-chart.md): Many series in very little height. (Pro) - [Slope Chart](https://obsydeui.com/charts/slope-chart.md): Two or three periods joined by straight lines, one per category. (Pro) - [Signal & Noise](https://obsydeui.com/charts/signal-noise.md): Raw readings as faint dots and a bold rolling average drawn through them, with an optional ±kσ band. (Pro) - [Overheat Seam](https://obsydeui.com/charts/overheat-seam.md): Today against yesterday. (Pro) - [Budget Columns](https://obsydeui.com/charts/budget-columns.md): Spending against a limit, counted out in cells that light up as money goes out. (Pro) - [Kiln Gauge](https://obsydeui.com/charts/kiln-gauge.md): A vertical segmented gauge lit like a kiln. (Pro) - [Ember Dust](https://obsydeui.com/charts/dust.md): A density scatter without bins. (Pro) - [Correlation Matrix](https://obsydeui.com/charts/correlation-matrix.md): Every pair of variables as a cell on a diverging scale: cool grey for negative, near-black at zero and bone for positive, with only the strongest pair in the accent (the heat ramp for positives is opt-in). (Pro) - [Marimekko](https://obsydeui.com/charts/marimekko.md): Variable-width stacked columns: each column is as wide as its total and split by share, so area is value. (Pro) - [Dial Gauge](https://obsydeui.com/charts/dial-gauge.md): One dial, four faces. (Pro) - [Pyramid](https://obsydeui.com/charts/pyramid.md): A population (butterfly) chart: two sides grow outward from a centre spine that carries the age bands, oldest on top. (Pro) - [Crucible](https://obsydeui.com/charts/crucible.md): One vessel per day, each filled to its value with molten metal. (Pro) - [Bar Race](https://obsydeui.com/charts/bar-race.md): A ranking that moves through time. (Pro) - [KPI Cards](https://obsydeui.com/charts/kpi-cards.md): Stat cards whose sparkline is a scrubber for the number above it. (Pro) ## Optional - [Changelog](https://obsydeui.com/changelog.md): what shipped, newest first. - [Pricing](https://obsydeui.com/pricing): Free, Pro and Team, each paid once. - [Licence](https://obsydeui.com/LICENSE.txt): the Obsyde Licence, for every piece. - [Registry index](https://obsydeui.com/r/registry.json): every installable unit, for the shadcn CLI and MCP server.