---
name: "@abui"
slug: "abui"
description: "Personal shadcn-compatible registry by Antonio Brandao conforming to Vercel's components.build specification. Includes blocks (Timeline/Gantt, Availability Calendar, Scroll Reveal, Animated Chart), components (Breakpoint Display, Radio Tabs, Radio Rows, Color Swatch Selector, Label Selector, Spinner, Scroll Progress, Text Gradient, Accordion Multiselect, Timeline Steps, Table of Contents), and utility CSS helpers (Orientation Media Queries, Extra Breakpoints, Debug Utils). Free, open-source. Use for: projects that need Gantt-style timelines, scroll-progress indicators, or composable selector patterns not covered by core shadcn/ui."
category: "Component library (general)"
tags: ["aesthetic", "animation", "backgrounds", "blocks", "cards", "charts", "components", "dashboard", "forms", "hooks", "loaders", "navigation", "tables"]
framework: "react"
license: null
author: "antoniobrandao"
website: "https://abui.io"
github: "https://github.com/antoniobrandao/abui"
registry: "https://abui.io/r/registry.json"
pro: false
pro_url: null
github_stars: 46
component_count: 20
generated_at: "2026-07-28T08:00:50.948Z"
---

# @abui

Personal shadcn-compatible registry by Antonio Brandao conforming to Vercel's components.build specification. Includes blocks (Timeline/Gantt, Availability Calendar, Scroll Reveal, Animated Chart), components (Breakpoint Display, Radio Tabs, Radio Rows, Color Swatch Selector, Label Selector, Spinner, Scroll Progress, Text Gradient, Accordion Multiselect, Timeline Steps, Table of Contents), and utility CSS helpers (Orientation Media Queries, Extra Breakpoints, Debug Utils). Free, open-source. Use for: projects that need Gantt-style timelines, scroll-progress indicators, or composable selector patterns not covered by core shadcn/ui.

## Links

- Website: https://abui.io
- GitHub: https://github.com/antoniobrandao/abui
- Registry JSON: https://abui.io/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/abui
- This file: https://sh4dcn.vercel.app/md/abui.md

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://abui.io/r/registry.json
pnpm dlx shadcn@latest add https://abui.io/r/registry.json
bunx shadcn@latest add https://abui.io/r/registry.json
# clone the source repo
git clone https://github.com/antoniobrandao/abui.git
# fetch the raw registry index
curl -s https://abui.io/r/registry.json
```

## Components (20)

| name | type | description | install |
| --- | --- | --- | --- |
| design-system | registry:style | — | `npx shadcn@latest add https://abui.io/r/design-system.json` |
| orientation-media-queries | registry:style | A set of device orientation media queries. | `npx shadcn@latest add https://abui.io/r/orientation-media-queries.json` |
| extra-breakpoints | registry:style | Adds XS, XXS and 3XL breakpoints. | `npx shadcn@latest add https://abui.io/r/extra-breakpoints.json` |
| debug-utils | registry:style | A set of debug utility classes. | `npx shadcn@latest add https://abui.io/r/debug-utils.json` |
| breakpoint-display | registry:component | A breakpoint display component. | `npx shadcn@latest add https://abui.io/r/breakpoint-display.json` |
| radio-tabs | registry:component | A radio tabs component. | `npx shadcn@latest add https://abui.io/r/radio-tabs.json` |
| radio-rows | registry:component | A radio rows component. | `npx shadcn@latest add https://abui.io/r/radio-rows.json` |
| color-swatch-selector | registry:component | A color swatch selector component. | `npx shadcn@latest add https://abui.io/r/color-swatch-selector.json` |
| label-selector | registry:component | A text label selector component for sizes, variants, and other text-based options. | `npx shadcn@latest add https://abui.io/r/label-selector.json` |
| spinner | registry:component | A customizable loading spinner component with size, speed, and color variants. | `npx shadcn@latest add https://abui.io/r/spinner.json` |
| scroll-progress | registry:component | A scroll progress indicator that shows reading progress as a horizontal bar at the top or bottom of the viewport. | `npx shadcn@latest add https://abui.io/r/scroll-progress.json` |
| text-gradient | registry:component | A text gradient effect component. | `npx shadcn@latest add https://abui.io/r/text-gradient.json` |
| timeline | registry:block | A Gantt-chart style timeline with draggable time slots. | `npx shadcn@latest add https://abui.io/r/timeline.json` |
| availability | registry:block | A weekly availability designer with draggable and resizable time slots. | `npx shadcn@latest add https://abui.io/r/availability.json` |
| calendar-year | registry:block | A calendar year component. | `npx shadcn@latest add https://abui.io/r/calendar-year.json` |
| accordion-multiselect | registry:component | An accordion multiselect component with categories and services. | `npx shadcn@latest add https://abui.io/r/accordion-multiselect.json` |
| scroll-reveal-content-a | registry:block | A block that shows 3 parts of content with a specific image for each part, and a fancy line grow expand during scroll. | `npx shadcn@latest add https://abui.io/r/scroll-reveal-content-a.json` |
| timeline-steps | registry:component | A component for displaying chronological events, activities, or steps | `npx shadcn@latest add https://abui.io/r/timeline-steps.json` |
| toc | registry:component | A table of contents component with active anchor tracking and depth-aware line styling. Features two variants: default (straight line) and clerk (depth-respons… | `npx shadcn@latest add https://abui.io/r/toc.json` |
| animated-chart | registry:block | An animated column chart with spring physics, viewport-triggered animations, and support for dynamic data transitions. | `npx shadcn@latest add https://abui.io/r/animated-chart.json` |

## For AI agents

```text
You are adding components from @abui to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/abui.md) for the component list.
2. Fetch the machine-readable index: https://abui.io/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: abui).
```