---
name: "@pulld"
slug: "pulld"
description: "Typed, accessible, theme-aware React/Tailwind components installable by the shadcn CLI or your AI coding agent. Free atoms plus composed Pro blocks."
category: "AI/chat UI"
tags: ["accessibility", "ai", "auth", "blocks", "buttons", "cards", "charts", "forms", "loaders", "maps", "media", "mobile", "onboarding", "overlays", "pro-available", "tables", "theming"]
framework: "react"
license: null
author: null
website: "https://pulld.pages.dev"
github: null
registry: "https://pulld.pages.dev/r/registry.json"
pro: true
pro_url: "https://pulld.pages.dev/go/pro"
github_stars: null
component_count: 92
generated_at: "2026-09-21T01:50:16.753Z"
---

# @pulld

Typed, accessible, theme-aware React/Tailwind components installable by the shadcn CLI or your AI coding agent. Free atoms plus composed Pro blocks.

## Links

- Website: https://pulld.pages.dev
- Registry JSON: https://pulld.pages.dev/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/pulld
- This file: https://sh4dcn.vercel.app/md/pulld.md
- Pro / pricing: https://pulld.pages.dev/go/pro

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://pulld.pages.dev/r/registry.json
pnpm dlx shadcn@latest add https://pulld.pages.dev/r/registry.json
bunx shadcn@latest add https://pulld.pages.dev/r/registry.json
# fetch the raw registry index
curl -s https://pulld.pages.dev/r/registry.json
```

## Components (92)

| name | type | description | install |
| --- | --- | --- | --- |
| copy-button | registry:ui | A one-click copy control: a square icon button that writes a string to the clipboard, swaps its clipboard icon for a tick, announces "Copied" to a screen reade… | `npx shadcn@latest add https://pulld.pages.dev/r/copy-button.json` |
| kbd | registry:ui | Inline keyboard key rendered as a real <kbd> element and styled as a bordered monospace keycap — a drop-in for a bare <kbd> tag that otherwise renders as unsty… | `npx shadcn@latest add https://pulld.pages.dev/r/kbd.json` |
| empty-state | registry:ui | The centred placeholder a screen shows when it has nothing to draw — a dashed panel with an optional icon, a heading, one line of explanation, and room for a c… | `npx shadcn@latest add https://pulld.pages.dev/r/empty-state.json` |
| stat-card | registry:ui | The single-number tile at the top of a dashboard: a label, one big value, and an optional percentage change with an up or down arrow — green when the number mo… | `npx shadcn@latest add https://pulld.pages.dev/r/stat-card.json` |
| theme-toggle | registry:ui | The one-button light/dark switch you drop in a navbar, header or settings row — click it and the whole app flips theme, and the choice survives a reload. Reach… | `npx shadcn@latest add https://pulld.pages.dev/r/theme-toggle.json` |
| avatar-stack | registry:ui | A facepile in one prop: pass a list of people and a maximum, get a row of overlapping circular avatars with everything past the maximum collapsed into a "+N" b… | `npx shadcn@latest add https://pulld.pages.dev/r/avatar-stack.json` |
| password-input | registry:ui | A password field with the show/hide eye already built in — the one control every sign-up form needs and shadcn/ui does not ship. It is a drop-in replacement fo… | `npx shadcn@latest add https://pulld.pages.dev/r/password-input.json` |
| spinner | registry:ui | An inline loading indicator that announces itself: a spinning lucide Loader2 inside a role="status" live region with a screen-reader-only label, so a pending o… | `npx shadcn@latest add https://pulld.pages.dev/r/spinner.json` |
| code-block | registry:ui | A read-only code panel: a bordered, scrollable box that shows a snippet with a copy button in the corner and an optional uppercase language label. Reach for it… | `npx shadcn@latest add https://pulld.pages.dev/r/code-block.json` |
| loading-button | registry:ui | Submit button that shows a spinner, announces itself, and refuses to fire twice while an async action is in flight. Set loading={true} for the duration of the … | `npx shadcn@latest add https://pulld.pages.dev/r/loading-button.json` |
| confirm-button | registry:ui | Inline two-step confirmation on the button itself: the first click arms it — the label swaps to "Confirm?" and the button turns destructive — and only the seco… | `npx shadcn@latest add https://pulld.pages.dev/r/confirm-button.json` |
| command-palette | registry:ui | A ready-made ⌘K command palette: one component you drop in, open with a keyboard shortcut, and fill with actions. Reach for it the moment a nav bar stops being… | `npx shadcn@latest add https://pulld.pages.dev/r/command-palette.json` |
| toast | registry:ui | A complete toast / notification system in one file: call `toast()` — or `toast.success` / `.error` / `.info` / `.warning` / `.loading` / `.promise` — from anyw… | `npx shadcn@latest add https://pulld.pages.dev/r/toast.json` |
| search-input | registry:ui | Search field with a leading magnifier icon and a trailing clear (✕) button that appears as soon as there is text, empties the field, and puts focus back so typ… | `npx shadcn@latest add https://pulld.pages.dev/r/search-input.json` |
| number-input | registry:ui | A number field with − and + stepper buttons either side of it. Reach for it wherever someone adjusts a number by one rather than typing it: a quantity picker i… | `npx shadcn@latest add https://pulld.pages.dev/r/number-input.json` |
| otp-input | registry:ui | A one-time passcode field split into separate digit boxes — the "enter the 6-digit code we sent you" screen. Reach for it on any challenge step where a short n… | `npx shadcn@latest add https://pulld.pages.dev/r/otp-input.json` |
| tag-input | registry:ui | A multi-value text field: what gets typed becomes a removable chip, and the value the form sees is a plain string[]. Enter or a comma commits the draft, Backsp… | `npx shadcn@latest add https://pulld.pages.dev/r/tag-input.json` |
| copy-field | registry:ui | Read-only field that shows a value with a copy button docked at its right edge: one click copies, and focusing or clicking anywhere in the field selects the wh… | `npx shadcn@latest add https://pulld.pages.dev/r/copy-field.json` |
| segmented-control | registry:ui | A row of 2–4 mutually exclusive choices drawn as one moving pill on a shared track — the iOS-style segmented control, and what most dashboards use to switch a … | `npx shadcn@latest add https://pulld.pages.dev/r/segmented-control.json` |
| step-indicator | registry:ui | Horizontal stepper that shows where someone is in a fixed sequence — numbered circle markers joined by a connecting line, each drawn as complete (filled, with … | `npx shadcn@latest add https://pulld.pages.dev/r/step-indicator.json` |
| rating | registry:ui | A star rating that works both ways: as an input that collects a score, and read-only as a display of one. Reach for it wherever a number between 0 and 5 is rea… | `npx shadcn@latest add https://pulld.pages.dev/r/rating.json` |
| timeline | registry:ui | A vertical timeline: a list of events drawn as dots on a connecting line, each with an optional timestamp, title, description and icon. Reach for it wherever t… | `npx shadcn@latest add https://pulld.pages.dev/r/timeline.json` |
| announcement-bar | registry:ui | A dismissible bar pinned above your header for a message the whole site needs to see: a launch or new release, a promo, sale or free-shipping offer, a schedule… | `npx shadcn@latest add https://pulld.pages.dev/r/announcement-bar.json` |
| file-dropzone | registry:ui | A drag-and-drop file upload area that is also a real file picker: drop files onto it, or click it — or focus it and press Enter or Space — to open the native c… | `npx shadcn@latest add https://pulld.pages.dev/r/file-dropzone.json` |
| progress-ring | registry:ui | A circular progress indicator: an SVG ring that fills clockwise from twelve o'clock, with the percentage — or any icon or short label you pass — sitting in the… | `npx shadcn@latest add https://pulld.pages.dev/r/progress-ring.json` |
| pricing-card | registry:ui | A single pricing plan card — one tier's box, with its name, its price, what it includes and the button that takes it. Reach for it wherever a plan has to be ch… | `npx shadcn@latest add https://pulld.pages.dev/r/pricing-card.json` |
| feature-card | registry:ui | An icon + heading + one line of copy, as the repeating tile in the features or benefits section of a landing or marketing page — a “why us” grid, “what’s inclu… | `npx shadcn@latest add https://pulld.pages.dev/r/feature-card.json` |
| gauge | registry:ui | A semicircular (half-circle) gauge or dial that shows one measurement inside a known range, drawn as an SVG arc that fills from the left and animates to its ne… | `npx shadcn@latest add https://pulld.pages.dev/r/gauge.json` |
| time-ago | registry:ui | Auto-updating relative timestamp — "3 minutes ago", "just now", "in 2 days" — that re-renders on a timer so the label stays fresh without a reload. Use it wher… | `npx shadcn@latest add https://pulld.pages.dev/r/time-ago.json` |
| multi-select | registry:ui | A searchable multi-select: choose several options from a list you define, each shown as a removable badge in the trigger. Reach for it wherever a field stores … | `npx shadcn@latest add https://pulld.pages.dev/r/multi-select.json` |
| countdown | registry:ui | A live countdown timer to a future moment — it re-renders every second, ticks down, never goes negative, and fires an onComplete callback once when it reaches … | `npx shadcn@latest add https://pulld.pages.dev/r/countdown.json` |
| inline-edit | registry:ui | Click-to-edit text that stays where it is: a value shown as plain text with a pencil affordance that swaps to an input in the same spot when activated, commits… | `npx shadcn@latest add https://pulld.pages.dev/r/inline-edit.json` |
| autosize-textarea | registry:ui | A textarea that grows as you type and stops at a maximum height, then scrolls. Reach for it wherever a fixed-height box is the wrong shape: a chat, message or … | `npx shadcn@latest add https://pulld.pages.dev/r/autosize-textarea.json` |
| currency-input | registry:ui | A money input that shows a grouped, currency-formatted amount ($1,234.50) when idle and the raw number while you're editing, so the cursor never fights the tho… | `npx shadcn@latest add https://pulld.pages.dev/r/currency-input.json` |
| floating-label-input | registry:ui | A text input whose label sits inside the field like a placeholder, then shrinks and floats up to straddle the top border the moment the field is focused or hol… | `npx shadcn@latest add https://pulld.pages.dev/r/floating-label-input.json` |
| bulk-action-bar | registry:ui | The bar that appears once rows are selected in a table or list — it shows "3 items selected", holds your bulk actions (delete, archive, export, assign, move, a… | `npx shadcn@latest add https://pulld.pages.dev/r/bulk-action-bar.json` |
| save-status | registry:ui | The small inline "Saving… / Saved 2 minutes ago / Couldn't save · Retry" indicator that sits beside an autosaving surface, and the announcement that goes with … | `npx shadcn@latest add https://pulld.pages.dev/r/save-status.json` |
| form-error-summary | registry:ui | The block that appears above a form after a failed submit — "There are 3 problems with your submission" followed by one link per error that jumps focus straigh… | `npx shadcn@latest add https://pulld.pages.dev/r/form-error-summary.json` |
| type-to-confirm | registry:ui | The confirmation step in front of an irreversible action: the user has to type the resource's own name ("acme-prod") before the destructive button turns on. Us… | `npx shadcn@latest add https://pulld.pages.dev/r/type-to-confirm.json` |
| keyboard-shortcuts | registry:ui | The help sheet that opens when the user presses ? — a modal listing every keyboard shortcut in the app, grouped by area, with the key caps drawn per platform. … | `npx shadcn@latest add https://pulld.pages.dev/r/keyboard-shortcuts.json` |
| upload-list | registry:ui | The list of files under a dropzone or file picker — one row each with the file name, its size, a progress bar while it uploads, an error with a retry button wh… | `npx shadcn@latest add https://pulld.pages.dev/r/upload-list.json` |
| bento-grid | registry:ui | The asymmetric panel grid behind most modern feature sections: a set of cards on one grid where a few cells are deliberately two columns wide or two rows tall,… | `npx shadcn@latest add https://pulld.pages.dev/r/bento-grid.json` |
| tree-view | registry:ui | The nested list you can open, close and walk with the arrow keys: a file explorer or file tree, a folder or directory tree, a category or taxonomy picker, an o… | `npx shadcn@latest add https://pulld.pages.dev/r/tree-view.json` |
| sortable-list | registry:ui | Drag-to-reorder list: grab a row's grip handle and drop it in a new place — and do the same thing from the keyboard, which is the half that is normally missing… | `npx shadcn@latest add https://pulld.pages.dev/r/sortable-list.json` |
| infinite-scroll | registry:ui | The footer of a list that keeps going: an invisible sentinel that loads the next page as it scrolls into view, plus a Load more button that always does the sam… | `npx shadcn@latest add https://pulld.pages.dev/r/infinite-scroll.json` |
| virtual-list | registry:ui | A long list that only puts the rows you can see into the DOM: five thousand rows render as about thirty nodes, so the page stops taking seconds to paint and sc… | `npx shadcn@latest add https://pulld.pages.dev/r/virtual-list.json` |
| read-more | registry:ui | Long text clamped to a few lines with a Show more / Show less toggle that appears only when the text is genuinely too long. Use it wherever text is usually sho… | `npx shadcn@latest add https://pulld.pages.dev/r/read-more.json` |
| middle-truncate | registry:ui | One line of text with the middle removed so that both ends stay readable, fitted to whatever width the container actually gives it. Use it for file names — whe… | `npx shadcn@latest add https://pulld.pages.dev/r/middle-truncate.json` |
| toc | registry:ui | A table of contents for the page the reader is on, with the section they are currently reading highlighted as they scroll. Use it for the "On this page" rail b… | `npx shadcn@latest add https://pulld.pages.dev/r/toc.json` |
| date-input | registry:ui | A date field you type into, one segment at a time, that emits an ISO "YYYY-MM-DD" string. Use it for date of birth and signup forms, booking and check-in/check… | `npx shadcn@latest add https://pulld.pages.dev/r/date-input.json` |
| sparkline | registry:ui | An inline SVG trend line — a sparkline — that shows the shape of a series in about the space of a line of text. Use it when you need a chart small enough to li… | `npx shadcn@latest add https://pulld.pages.dev/r/sparkline.json` |
| slug-input | registry:ui | A URL slug field that fills itself in from a title and then gets out of the way. Use it wherever a record needs a URL: the permalink or slug field in a blog po… | `npx shadcn@latest add https://pulld.pages.dev/r/slug-input.json` |
| password-strength | registry:ui | A password strength meter for a sign-up, registration, change-password or reset-password form — the bar under the password field that says Weak or Strong, plus… | `npx shadcn@latest add https://pulld.pages.dev/r/password-strength.json` |
| diff-view | registry:ui | A line-by-line diff of two strings — the before/after view a screen needs when it has to show what changed: a config or settings change, a record edited in an … | `npx shadcn@latest add https://pulld.pages.dev/r/diff-view.json` |
| calendar-heatmap | registry:ui | A year of daily counts as a grid of shaded squares — the GitHub-style contribution graph, drawn for whatever your app counts per day: commits, deploys, orders,… | `npx shadcn@latest add https://pulld.pages.dev/r/calendar-heatmap.json` |
| ansi-log | registry:ui | Renders raw terminal output — escape sequences and all — as styled, theme-aware HTML. Reach for it wherever a process's own output has to be shown inside a pag… | `npx shadcn@latest add https://pulld.pages.dev/r/ansi-log.json` |
| cron-expression | registry:ui | Turns a cron expression into a sentence anyone can read, and lists the next times it fires. Reach for it wherever a schedule is shown rather than edited: a sch… | `npx shadcn@latest add https://pulld.pages.dev/r/cron-expression.json` |
| ratio-bar | registry:ui | One horizontal bar that shows how a whole is divided up, with a legend that names every part — the GitHub-style language / storage bar. Reach for it whenever t… | `npx shadcn@latest add https://pulld.pages.dev/r/ratio-bar.json` |
| scroll-progress | registry:ui | A bar that fills as the reader scrolls — the reading indicator across the top of an article, and the "how much is left?" cue on anything long. Use it on blog p… | `npx shadcn@latest add https://pulld.pages.dev/r/scroll-progress.json` |
| duration-input | registry:ui | A text field that takes a length of time written the way people actually write one — 90m, 1h30m, 1h 30m, 2d 4h 15m, 1:30, 1.5h, 500ms, "90 minutes" — reads it … | `npx shadcn@latest add https://pulld.pages.dev/r/duration-input.json` |
| color-picker | registry:ui | A colour picker built from a hex/rgb/hsl text box and native hue, saturation and lightness sliders, with optional alpha and preset swatches. Reach for it where… | `npx shadcn@latest add https://pulld.pages.dev/r/color-picker.json` |
| json-viewer | registry:ui | Renders a parsed JSON value as a collapsible, type-coloured tree you can read and navigate. Reach for it wherever a page has to show a payload the reader did n… | `npx shadcn@latest add https://pulld.pages.dev/r/json-viewer.json` |
| image-comparison | registry:ui | A before/after slider: two images stacked in the same box with a divider you drag across them, so the second is revealed over the first instead of sitting next… | `npx shadcn@latest add https://pulld.pages.dev/r/image-comparison.json` |
| timezone-select | registry:ui | A time zone picker: every IANA zone the browser knows, grouped by region and labelled with the UTC offset it is actually on — "New York (UTC-04:00)", "Kolkata … | `npx shadcn@latest add https://pulld.pages.dev/r/timezone-select.json` |
| month-picker | registry:ui | A month picker: a year of twelve months as a grid, with arrows on the year, that hands back a plain "YYYY-MM" string — "2026-08" — and never a day or a time zo… | `npx shadcn@latest add https://pulld.pages.dev/r/month-picker.json` |
| time-input | registry:ui | A time field you type into, one segment at a time, that hands back a plain 24-hour clock string — "09:30", or "09:30:15" with seconds — and never a date and ne… | `npx shadcn@latest add https://pulld.pages.dev/r/time-input.json` |
| weekly-hours | registry:ui | A week of opening hours in one editor: seven rows, each a switch plus an opening and a closing time, handing back a plain object keyed by weekday. Reach for it… | `npx shadcn@latest add https://pulld.pages.dev/r/weekly-hours.json` |
| country-select | registry:ui | A country picker: all 249 ISO 3166-1 countries, named in the reader's own language, sorted the way that language sorts, and searchable by local name, English n… | `npx shadcn@latest add https://pulld.pages.dev/r/country-select.json` |
| currency-select | registry:ui | A currency picker: every ISO 4217 currency the runtime knows, named in the reader's own language, sorted the way that language sorts, and searchable by local n… | `npx shadcn@latest add https://pulld.pages.dev/r/currency-select.json` |
| language-select | registry:ui | A UI language picker: every language named in its own language — 日本語, Deutsch, العربية, 한국어 — with its name in the page's language beside it, its BCP-47 tag, a… | `npx shadcn@latest add https://pulld.pages.dev/r/language-select.json` |
| phone-input | registry:ui | An international phone number field: a searchable country picker, that country's calling code shown as a live prefix, and one E.164 string ("+819012345678") co… | `npx shadcn@latest add https://pulld.pages.dev/r/phone-input.json` |
| password-generator | registry:ui | A password generator: a read-only field holding the generated password, a Generate control, a copy button, and switches for length, character classes and look-… | `npx shadcn@latest add https://pulld.pages.dev/r/password-generator.json` |
| network-status | registry:ui | An offline banner that is right about being offline: it tells someone the page has lost the network, and — the harder half — only tells them it is back once th… | `npx shadcn@latest add https://pulld.pages.dev/r/network-status.json` |
| recovery-codes | registry:ui | The sheet of two-factor backup codes, with the three ways off the screen that people actually use: copy, download as a .txt, and print. Reach for it wherever a… | `npx shadcn@latest add https://pulld.pages.dev/r/recovery-codes.json` |
| unsaved-changes-guard | registry:ui | A leave guard for a form with unsaved changes: it holds the departure, asks whether the work should be discarded, and lets it through only when the answer is y… | `npx shadcn@latest add https://pulld.pages.dev/r/unsaved-changes-guard.json` |
| csv-export-button | registry:ui | A button that turns rows into a CSV file the browser saves — with the two things the inline version gets wrong already handled: the spreadsheet formulas hiding… | `npx shadcn@latest add https://pulld.pages.dev/r/csv-export-button.json` |
| idle-timeout | registry:ui | An inactivity timeout with a warning before it fires: it watches for the user going away, puts up a "you will be signed out in 1:59" dialog with a live countdo… | `npx shadcn@latest add https://pulld.pages.dev/r/idle-timeout.json` |
| char-counter | registry:ui | The "42 left" that sits under a field with a limit — a bio, a post box, a product description, an SMS body, a subject line — counting the characters a person c… | `npx shadcn@latest add https://pulld.pages.dev/r/char-counter.json` |
| scroll-shadow | registry:ui | A scrolling box whose edges fade out while there is more content past them, and stop fading the moment there is not — the cue that tells a reader a wide table … | `npx shadcn@latest add https://pulld.pages.dev/r/scroll-shadow.json` |
| mention-input | registry:ui | The comment box where typing `@` opens a list of people and picking one types their handle in — the completion that lives inside the prose, anchored under the … | `npx shadcn@latest add https://pulld.pages.dev/r/mention-input.json` |
| signature-pad | registry:ui | The box at the bottom of a form where somebody signs with a finger, a mouse or a stylus — and, beside it, the field where somebody who cannot draw types their … | `npx shadcn@latest add https://pulld.pages.dev/r/signature-pad.json` |
| image-crop | registry:ui | The step that comes straight after a photo is chosen: the picture sits behind a frame of the shape the product needs, and you drag it about and pinch or scroll… | `npx shadcn@latest add https://pulld.pages.dev/r/image-crop.json` |
| sort-header | registry:ui | One sortable column heading for a table you already have: press it and the rows re-order, press it again for the other direction, press it a third time and the… | `npx shadcn@latest add https://pulld.pages.dev/r/sort-header.json` |
| qr-code | registry:ui | A scannable QR code, drawn as SVG, for putting a link, a Wi-Fi network or a 2FA secret on screen where a phone can pick it up. Reach for it wherever something … | `npx shadcn@latest add https://pulld.pages.dev/r/qr-code.json` |
| share-button | registry:ui | A share control that opens the device's native share sheet and quietly degrades to copying the link where that sheet does not exist. Reach for it wherever a pa… | `npx shadcn@latest add https://pulld.pages.dev/r/share-button.json` |
| print-button | registry:ui | Prints one region of the page — an invoice, a receipt, an order confirmation, a ticket or boarding pass, a packing slip, a report or dashboard panel, a chart, … | `npx shadcn@latest add https://pulld.pages.dev/r/print-button.json` |
| masked-input | registry:ui | Holds a text field to one fixed shape while it is typed — a postal or ZIP code, a product or licence key, a serial, model or part number, an employee, member, … | `npx shadcn@latest add https://pulld.pages.dev/r/masked-input.json` |
| fullscreen-button | registry:ui | A button that shows one element — a chart, a data table, a map, a video player, a preview pane — full-screen on its own, and keeps telling the truth about it a… | `npx shadcn@latest add https://pulld.pages.dev/r/fullscreen-button.json` |
| wake-lock-toggle | registry:ui | A toggle that stops the screen going dark while somebody is looking at it but not touching it, and — unlike every version written by hand — keeps on being true… | `npx shadcn@latest add https://pulld.pages.dev/r/wake-lock-toggle.json` |
| geolocation-button | registry:ui | A "use my current location" button that is right about why it didn't. It asks the device for a position and, when that is refused, works out which of four unre… | `npx shadcn@latest add https://pulld.pages.dev/r/geolocation-button.json` |
| highlight-text | registry:ui | Text with the parts matching a search query highlighted, built so that neither the text nor the query can break it — and both of them routinely arrive from a U… | `npx shadcn@latest add https://pulld.pages.dev/r/highlight-text.json` |
| image-zoom | registry:ui | A frame that zooms whatever is inside it — wheel, trackpad pinch, double click or the buttons — and lets you drag it around once it no longer fits. Reach for i… | `npx shadcn@latest add https://pulld.pages.dev/r/image-zoom.json` |

## For AI agents

```text
You are adding components from @pulld to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/pulld.md) for the component list.
2. Fetch the machine-readable index: https://pulld.pages.dev/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: pulld).
```