# Hirael

> The components shadcn/ui doesn't ship: React components, section blocks, and full-page templates distributed through the shadcn registry schema. Install any item with `npx shadcn@latest add https://hirael.com/r/<name>.json` (Radix UI) or `https://hirael.com/r/base/<name>.json` (Base UI); the source copies into the consumer's repo.

Every item below has a machine-readable registry JSON at `/r/<name>.json` (Radix UI) and `/r/base/<name>.json` (Base UI) containing its full source files, dependencies, and install targets, plus a Markdown version of its documentation page at `/r/<name>.md` (and `/r/base/<name>.md`) carrying the install command, usage, examples, full source, and API tables in one document. Human-facing pages embed live demos of each item.

## Components
- [Multi Select](https://hirael.com/components/inputs/multi-select): Chip-based multi-select with command-palette dropdown, search, select-all and a loading state. Compound and single-prop APIs. Markdown: https://hirael.com/r/multi-select.md. Registry JSON: https://hirael.com/r/multi-select.json
- [Number Range](https://hirael.com/components/inputs/number-range): Two-thumb slider paired with synced number inputs. Min/max/step, currency or unit formatting, keyboard-first. Markdown: https://hirael.com/r/number-range.md. Registry JSON: https://hirael.com/r/number-range.json
- [Tag Input](https://hirael.com/components/inputs/tag-input): Chip input with paste-to-split, dedupe, validation hook and max tags. Markdown: https://hirael.com/r/tag-input.md. Registry JSON: https://hirael.com/r/tag-input.json
- [Duration Input](https://hirael.com/components/inputs/duration-input): Segmented duration field over days, hours, minutes and seconds. Digits auto-advance, arrows step, and the value stays a plain number of seconds. Markdown: https://hirael.com/r/duration-input.md. Registry JSON: https://hirael.com/r/duration-input.json
- [Number Field](https://hirael.com/components/inputs/number-field): Number input with step buttons, arrow-key and hold-to-repeat stepping, min and max, and Intl formatting for currency, percent or units. Submits the raw number. Markdown: https://hirael.com/r/number-field.md. Registry JSON: https://hirael.com/r/number-field.json
- [Segmented Control](https://hirael.com/components/inputs/segmented-control): Single-choice control with a sliding thumb. Keyboard works like a radio group and mirrors in RTL. Two sizes, icons, disabled options and a full-width mode. Markdown: https://hirael.com/r/segmented-control.md. Registry JSON: https://hirael.com/r/segmented-control.json
- [Autocomplete](https://hirael.com/components/inputs/autocomplete): A free-text input with suggestions from a local list or an async search, with optional inline completion, groups and recent entries. The value is whatever you type. Markdown: https://hirael.com/r/autocomplete.md. Registry JSON: https://hirael.com/r/autocomplete.json
- [Checkbox Group](https://hirael.com/components/inputs/checkbox-group): A group of checkboxes with a select-all parent, nested groups, min and max limits, and an optional search that narrows the list. Markdown: https://hirael.com/r/checkbox-group.md. Registry JSON: https://hirael.com/r/checkbox-group.json
- [Lazy Select](https://hirael.com/components/inputs/lazy-select): Autocomplete single-select that defers loading until open and pages through results on scroll. Debounced server-side search with a pluggable lazy paginator hook. Markdown: https://hirael.com/r/lazy-select.md. Registry JSON: https://hirael.com/r/lazy-select.json
- [Password Input](https://hirael.com/components/inputs/password-input): Password field with a show/hide toggle and an optional pluggable strength meter. Markdown: https://hirael.com/r/password-input.md. Registry JSON: https://hirael.com/r/password-input.json
- [Currency Input](https://hirael.com/components/inputs/currency-input): Locale-aware grouping with currency-symbol prefix and configurable decimal precision. Markdown: https://hirael.com/r/currency-input.md. Registry JSON: https://hirael.com/r/currency-input.json
- [Phone Input](https://hirael.com/components/inputs/phone-input): Phone number field with a country dial-code picker and E.164 output from libphonenumber-js. Markdown: https://hirael.com/r/phone-input.md. Registry JSON: https://hirael.com/r/phone-input.json
- [Rating](https://hirael.com/components/inputs/rating): Star rating with hover preview, half-star precision, read-only mode and sm / md / lg sizes. Markdown: https://hirael.com/r/rating.md. Registry JSON: https://hirael.com/r/rating.json
- [Mention Input](https://hirael.com/components/inputs/mention-input): @-mention textarea with caret-anchored autocomplete, highlighted mention chips, async search and multiple trigger characters. Markdown: https://hirael.com/r/mention-input.md. Registry JSON: https://hirael.com/r/mention-input.json
- [Rich Text Editor](https://hirael.com/components/inputs/rich-text-editor): Tiptap editor with a formatting toolbar (headings, lists, links, highlight, alignment) and a hover bubble to edit or unlink links inline. Outputs HTML, controlled or uncontrolled, with composable parts. Markdown: https://hirael.com/r/rich-text-editor.md. Registry JSON: https://hirael.com/r/rich-text-editor.json
- [Inline Edit](https://hirael.com/components/inputs/inline-edit): Click-to-edit text with preview, validation, async submit and confirm/cancel controls. Input and textarea modes. Markdown: https://hirael.com/r/inline-edit.md. Registry JSON: https://hirael.com/r/inline-edit.json
- [Signature Pad](https://hirael.com/components/inputs/signature-pad): Signature capture on signature_pad: smooth ink, per-stroke undo, ink that follows the theme, and PNG/JPEG export via ref. Markdown: https://hirael.com/r/signature-pad.md. Registry JSON: https://hirael.com/r/signature-pad.json
- [YAML Editor](https://hirael.com/components/inputs/yaml-editor): Editable code field with dependency-free YAML syntax highlighting, a line-number gutter and tab-to-indent. Controlled or uncontrolled. Markdown: https://hirael.com/r/yaml-editor.md. Registry JSON: https://hirael.com/r/yaml-editor.json
- [Cron Editor](https://hirael.com/components/inputs/cron-editor): Visual cron builder kept in sync with the raw expression. Presets, per-field modes, validation, a plain-English preview, and the next run times. Markdown: https://hirael.com/r/cron-editor.md. Registry JSON: https://hirael.com/r/cron-editor.json
- [Country Select](https://hirael.com/components/inputs/country-select): Searchable country picker with flag emoji, pinned countries, optional dial codes, and single or multiple selection. Search by name or ISO code. Markdown: https://hirael.com/r/country-select.md. Registry JSON: https://hirael.com/r/country-select.json
- [Address Input](https://hirael.com/components/inputs/address-input): Postal address field group that follows the selected country: which fields appear, the order they sit in, and what they are called. Markdown: https://hirael.com/r/address-input.md. Registry JSON: https://hirael.com/r/address-input.json
- [Credit Card Input](https://hirael.com/components/inputs/credit-card-input): Card number, expiry, and CVC in one row with brand detection, per-brand grouping, Luhn and expiry validation, and auto-advance between fields. Markdown: https://hirael.com/r/credit-card-input.md. Registry JSON: https://hirael.com/r/credit-card-input.json
- [Masked Input](https://hirael.com/components/inputs/masked-input): A shadcn Input that formats as you type, for IBANs, postcodes, dates, licence plates or your own pattern. Reports the masked text, the bare characters and whether the mask is complete. Ships presets for common formats. Markdown: https://hirael.com/r/masked-input.md. Registry JSON: https://hirael.com/r/masked-input.json
- [Filter Builder](https://hirael.com/components/inputs/filter-builder): A Linear-style filter bar for lists and tables: pick a field, then an option, and get a chip with an operator menu and a value editor. Handles options, multi-select, text, number ranges and date ranges, keeps every filter in one array you can save to the URL, and ships applyFilters for client-side lists. Markdown: https://hirael.com/r/filter-builder.md. Registry JSON: https://hirael.com/r/filter-builder.json
- [Year Picker](https://hirael.com/components/pickers/year-picker): Decade-grid year picker with keyboard nav, min/max bounds, single or range mode. Markdown: https://hirael.com/r/year-picker.md. Registry JSON: https://hirael.com/r/year-picker.json
- [Month Picker](https://hirael.com/components/pickers/month-picker): 4×3 month grid with year stepper, keyboard nav, min/max bounds, single or range mode. Markdown: https://hirael.com/r/month-picker.md. Registry JSON: https://hirael.com/r/month-picker.json
- [Time Picker](https://hirael.com/components/pickers/time-picker): Hour, minute and optional second scroll columns with 12/24h modes, step intervals and keyboard nav. Markdown: https://hirael.com/r/time-picker.md. Registry JSON: https://hirael.com/r/time-picker.json
- [Color Picker](https://hirael.com/components/pickers/color-picker): Color picker on react-colorful with HEX / RGB / HSL inputs (colord), an eyedropper where supported, and recent swatches. Markdown: https://hirael.com/r/color-picker.md. Registry JSON: https://hirael.com/r/color-picker.json
- [Date Picker](https://hirael.com/components/pickers/date-picker): Single-date picker: a trigger that formats the date, opening shadcn Calendar in a popover. Takes react-day-picker matchers for bounds and disabled days. Markdown: https://hirael.com/r/date-picker.md. Registry JSON: https://hirael.com/r/date-picker.json
- [Date Range Picker](https://hirael.com/components/pickers/date-range-picker): Range picker on shadcn Calendar: preset column, one or two months, and react-day-picker matchers for bounds and disabled days. Markdown: https://hirael.com/r/date-range-picker.md. Registry JSON: https://hirael.com/r/date-range-picker.json
- [Emoji Picker](https://hirael.com/components/pickers/emoji-picker): Emoji picker on frimousse: the full emoji set by category, search, skin tones, keyboard navigation and a hover preview. Markdown: https://hirael.com/r/emoji-picker.md. Registry JSON: https://hirael.com/r/emoji-picker.json
- [Date Time Picker](https://hirael.com/components/pickers/date-time-picker): One field for a day and a time: a calendar beside hour and minute columns, with an AM/PM column on a 12-hour clock. Picking a day keeps the time, minutes snap to a step, and the value is a single Date. Markdown: https://hirael.com/r/date-time-picker.md. Registry JSON: https://hirael.com/r/date-time-picker.json
- [Time Slot Picker](https://hirael.com/components/pickers/time-slot-picker): Pick a meeting time: a calendar where days without free slots are disabled, beside the times for the chosen day. Booked slots show crossed out, and arrow keys skip over them. Markdown: https://hirael.com/r/time-slot-picker.md. Registry JSON: https://hirael.com/r/time-slot-picker.json
- [File Dropzone](https://hirael.com/components/files/file-dropzone): Drag-and-drop or click upload zone on react-dropzone, with a file list, type and size validation, and readable rejection messages. Markdown: https://hirael.com/r/file-dropzone.md. Registry JSON: https://hirael.com/r/file-dropzone.json
- [Image Cropper](https://hirael.com/components/files/image-cropper): Pan-and-zoom image cropper on react-easy-crop: rect or round mask, fixed aspect, zoom slider and canvas export via ref. Markdown: https://hirael.com/r/image-cropper.md. Registry JSON: https://hirael.com/r/image-cropper.json
- [Media Input](https://hirael.com/components/files/media-input): Local media file picker that previews via an object URL; empty-state prompt, replace and clear, size validation. Nothing leaves the browser. Markdown: https://hirael.com/r/media-input.md. Registry JSON: https://hirael.com/r/media-input.json
- [Avatar Upload](https://hirael.com/components/files/avatar-upload): Click or drop an image, crop it to a circle or square with zoom, and preview the result. Initials fallback, size and type limits, remove control. Markdown: https://hirael.com/r/avatar-upload.md. Registry JSON: https://hirael.com/r/avatar-upload.json
- [PDF Viewer](https://hirael.com/components/files/pdf-viewer): Shows a PDF in your page on react-pdf: page arrows and a page number field, zoom steps, fit to width and a download button. Text can be selected and links work, and the arrow keys turn pages. Markdown: https://hirael.com/r/pdf-viewer.md. Registry JSON: https://hirael.com/r/pdf-viewer.json
- [File Card](https://hirael.com/components/files/file-card): A file as a row for lists or a tile for grids: an icon picked from the type, or an image preview, with the name, size and your own actions. FileIcon and fileKindOf are exported for your own layouts. Markdown: https://hirael.com/r/file-card.md. Registry JSON: https://hirael.com/r/file-card.json
- [Upload Queue](https://hirael.com/components/files/upload-queue): Uploads files a few at a time with progress for each and overall, plus cancel, retry and clear finished. useUploadQueue takes your upload function, so it works with S3, a signed URL or your own API, and pairs with File Dropzone. Markdown: https://hirael.com/r/upload-queue.md. Registry JSON: https://hirael.com/r/upload-queue.json
- [Timeline](https://hirael.com/components/data/timeline): Vertical event timeline with default or icon dots, tone variants and labelled time / title / description parts. Markdown: https://hirael.com/r/timeline.md. Registry JSON: https://hirael.com/r/timeline.json
- [Avatar Stack](https://hirael.com/components/data/avatar-stack): Overlapping avatar group with size (sm/md/lg) and spacing (tight/normal/loose) variants, image or fallback support, numeric overflow chip, and asChild on items/overflow so each avatar can render as a link or button. Markdown: https://hirael.com/r/avatar-stack.md. Registry JSON: https://hirael.com/r/avatar-stack.json
- [Tree View](https://hirael.com/components/data/tree-view): Collapsible nested tree for file explorers and hierarchical data, with auto folder/file icons, depth indentation, selection and keyboard focus. Markdown: https://hirael.com/r/tree-view.md. Registry JSON: https://hirael.com/r/tree-view.json
- [Animated Number](https://hirael.com/components/data/animated-number): Count-up number that tweens to its target with easing, Intl formatting (currency, compact, percent), prefix/suffix and reduced-motion support. Markdown: https://hirael.com/r/animated-number.md. Registry JSON: https://hirael.com/r/animated-number.json
- [Sortable](https://hirael.com/components/data/sortable): Drag-to-reorder list on dnd-kit: pointer and keyboard sorting, handle or whole-item dragging, and controls inside items that stay clickable. Markdown: https://hirael.com/r/sortable.md. Registry JSON: https://hirael.com/r/sortable.json
- [Countdown Timer](https://hirael.com/components/data/countdown-timer): Count-down-to-date timer with boxed / inline / minimal variants, a useCountdown hook, digit animation and completion content. Markdown: https://hirael.com/r/countdown-timer.md. Registry JSON: https://hirael.com/r/countdown-timer.json
- [Relative Time](https://hirael.com/components/data/relative-time): Live "3 minutes ago" label on a semantic <time>, formatted with Intl for any locale. Every instance shares one timer per refresh rate, and old dates refresh hourly. Markdown: https://hirael.com/r/relative-time.md. Registry JSON: https://hirael.com/r/relative-time.json
- [Calendar Heatmap](https://hirael.com/components/data/calendar-heatmap): GitHub-style contribution heatmap with month and weekday labels, tooltips, configurable intensity scale and a legend. Markdown: https://hirael.com/r/calendar-heatmap.md. Registry JSON: https://hirael.com/r/calendar-heatmap.json
- [Data Table](https://hirael.com/components/data/data-table): TanStack-powered data table: faceted, text, range and date filters, sortable columns, column visibility, row selection and pagination, with page, sort and filters kept in the URL. One useDataTable hook drives it: pass pageCount to query server-side, or omit it to sort, filter and page a local array in memory. Ships as a folder of composable parts. Markdown: https://hirael.com/r/data-table.md. Registry JSON: https://hirael.com/r/data-table.json
- [Metric Card](https://hirael.com/components/data/metric-card): Compact metric card with a value and unit, a tone-aware sparkline and an up / down trend line. Compound API. Markdown: https://hirael.com/r/metric-card.md. Registry JSON: https://hirael.com/r/metric-card.json
- [Kanban](https://hirael.com/components/data/kanban): Board of columns and cards on dnd-kit: pointer and keyboard drag-and-drop across columns, a drag overlay, an empty-column hint, and one commit per move. Markdown: https://hirael.com/r/kanban.md. Registry JSON: https://hirael.com/r/kanban.json
- [Sparkline](https://hirael.com/components/data/sparkline): Tiny inline chart on recharts in line, area or bar form with optional curve, last-point dot, reference line and hover tooltip. Tints with currentColor. Markdown: https://hirael.com/r/sparkline.md. Registry JSON: https://hirael.com/r/sparkline.json
- [Gauge](https://hirael.com/components/data/gauge): Radial SVG gauge for a single reading on a scale, with threshold bands that recolour the arc, an animated sweep and a centred value and caption. Any start and end angle, from a half circle to a full ring. Markdown: https://hirael.com/r/gauge.md. Registry JSON: https://hirael.com/r/gauge.json
- [Meter](https://hirael.com/components/data/meter): Linear meter for how much of a limit is used, like storage or an API quota, with stacked segments, a legend and thresholds that change the colour. Unlike Progress, which tracks a task, it shows an amount against a limit. Markdown: https://hirael.com/r/meter.md. Registry JSON: https://hirael.com/r/meter.json
- [Description List](https://hirael.com/components/data/description-list): Label and value pairs for detail pages, like an invoice, a user or a server. Terms sit beside their values when there is room and stack on narrow screens, with optional columns, dividers and icons. Markdown: https://hirael.com/r/description-list.md. Registry JSON: https://hirael.com/r/description-list.json
- [Comment Thread](https://hirael.com/components/data/comment-thread): A discussion thread for documents, designs or issues: comments with avatars, emoji reactions you can toggle, indented replies, a composer that sends with Ctrl or ⌘ + Enter, and a resolve button that folds the thread away. Markdown: https://hirael.com/r/comment-thread.md. Registry JSON: https://hirael.com/r/comment-thread.json
- [Virtual List](https://hirael.com/components/data/virtual-list): A list that renders only the rows in view, so thousands of items scroll smoothly. Rows can be any height and are measured as they render, and it asks for the next page as the reader nears the end, with a loading row and an empty state. Markdown: https://hirael.com/r/virtual-list.md. Registry JSON: https://hirael.com/r/virtual-list.json
- [Kbd Button](https://hirael.com/components/display/kbd-button): A pressable 3D keycap with hover lift and a pressed state, for shortcut legends and keyboard-driven UIs. Pairs with shadcn's Kbd and KbdGroup for inline shortcuts and chords. Markdown: https://hirael.com/r/kbd-button.md. Registry JSON: https://hirael.com/r/kbd-button.json
- [Callout](https://hirael.com/components/display/callout): MDX-style admonition with neutral / info / success / warning / destructive variants, CalloutTitle and CalloutDescription parts, and an optional icon override. Ships --info / --success / --warning theme tokens. Markdown: https://hirael.com/r/callout.md. Registry JSON: https://hirael.com/r/callout.json
- [Scroll Progress](https://hirael.com/components/display/scroll-progress): Fixed reading progress bar. Tracks document scroll by default or a scoped container ref. Markdown: https://hirael.com/r/scroll-progress.md. Registry JSON: https://hirael.com/r/scroll-progress.json
- [Announcement Bar](https://hirael.com/components/display/announcement-bar): Top-of-page banner with default / primary / muted tones, optional dismiss button and localStorage persistence. Markdown: https://hirael.com/r/announcement-bar.md. Registry JSON: https://hirael.com/r/announcement-bar.json
- [Copy Button](https://hirael.com/components/display/copy-button): Click-to-copy button with copied feedback, icon-only or labelled, ghost / outline variants and a non-secure-context clipboard fallback. Markdown: https://hirael.com/r/copy-button.md. Registry JSON: https://hirael.com/r/copy-button.json
- [Icon Stack](https://hirael.com/components/display/icon-stack): Isometric stack of plates with an icon skewed onto the front face, for feature headers and empty states. Layer count is a prop, and the plates take their color from the surrounding text. Markdown: https://hirael.com/r/icon-stack.md. Registry JSON: https://hirael.com/r/icon-stack.json
- [Marquee](https://hirael.com/components/display/marquee): Infinite scrolling row or column for logos and testimonials, with pause-on-hover, reverse and vertical modes. Keyframes ship inline, zero config. Markdown: https://hirael.com/r/marquee.md. Registry JSON: https://hirael.com/r/marquee.json
- [Image Compare](https://hirael.com/components/display/image-compare): Before/after comparison slider with a draggable, keyboard-accessible divider, horizontal or vertical orientation and hover-follow mode. Markdown: https://hirael.com/r/image-compare.md. Registry JSON: https://hirael.com/r/image-compare.json
- [Lightbox](https://hirael.com/components/display/lightbox): Fullscreen image lightbox on Radix Dialog with gallery navigation, zoom and pan, swipe gestures, captions and a thumbnail strip. Markdown: https://hirael.com/r/lightbox.md. Registry JSON: https://hirael.com/r/lightbox.json
- [QR Code](https://hirael.com/components/display/qr-code): QR code on uqr, rendered as crisp SVG, with L/M/Q/H error correction, quiet-zone control and custom colors. Markdown: https://hirael.com/r/qr-code.md. Registry JSON: https://hirael.com/r/qr-code.json
- [Code Block](https://hirael.com/components/display/code-block): Code display with built-in dependency-free syntax highlighting via theme tokens, line numbers, line highlights, diff gutters, copy button and collapsible max-height. Markdown: https://hirael.com/r/code-block.md. Registry JSON: https://hirael.com/r/code-block.json
- [Masonry](https://hirael.com/components/display/masonry): True masonry layout that balances children into the shortest column by measured height, order-preserving, responsive, dependency-free. Markdown: https://hirael.com/r/masonry.md. Registry JSON: https://hirael.com/r/masonry.json
- [Audio Player](https://hirael.com/components/display/audio-player): Composable audio player with play/pause, scrub-safe seek with buffered tint, skip, time readouts, volume and playback rate. Markdown: https://hirael.com/r/audio-player.md. Registry JSON: https://hirael.com/r/audio-player.json
- [Video Player](https://hirael.com/components/display/video-player): Composable video player with click or Space to play, scrub-safe seek with buffered tint, time readouts, volume, full screen, and controls that fade out while it plays. Markdown: https://hirael.com/r/video-player.md. Registry JSON: https://hirael.com/r/video-player.json
- [Confirm](https://hirael.com/components/display/confirm): Imperative confirmation dialog: a root provider plus a useConfirm hook that resolves a promise on confirm or cancel. Default or destructive tone, an optional icon, and an async confirm action with a pending spinner. Markdown: https://hirael.com/r/confirm.md. Registry JSON: https://hirael.com/r/confirm.json
- [Unsaved Guard](https://hirael.com/components/display/unsaved-guard): Unsaved-changes guard: a root provider plus a useUnsavedGuard hook. Warns before reload, tab close and in-app link navigation, and returns a guard(proceed) to wrap programmatic navigation in a confirm dialog. Markdown: https://hirael.com/r/unsaved-guard.md. Registry JSON: https://hirael.com/r/unsaved-guard.json
- [JSON Viewer](https://hirael.com/components/display/json-viewer): Collapsible JSON tree with typed value colors, item counts on closed nodes, long-string truncation, expand or collapse all, copy, and arrow-key navigation. Markdown: https://hirael.com/r/json-viewer.md. Registry JSON: https://hirael.com/r/json-viewer.json
- [Blur Reveal](https://hirael.com/components/animation/blur-reveal): Reveals content with a blur, fade and lift as it scrolls into view. Configurable delay, duration and threshold; respects reduced-motion. Markdown: https://hirael.com/r/blur-reveal.md. Registry JSON: https://hirael.com/r/blur-reveal.json
- [Text Reveal](https://hirael.com/components/animation/text-reveal): Staggered text entrance that masks and slides each word, character or line into place on scroll. Respects reduced-motion. Markdown: https://hirael.com/r/text-reveal.md. Registry JSON: https://hirael.com/r/text-reveal.json
- [Text Shimmer](https://hirael.com/components/animation/text-shimmer): Text with a moving highlight for loading labels like "Thinking...". CSS only, follows the text colour, runs the other way in RTL and stays still when reduced motion is on. Markdown: https://hirael.com/r/text-shimmer.md. Registry JSON: https://hirael.com/r/text-shimmer.json
- [Scroll Reveal](https://hirael.com/components/animation/scroll-reveal): Fades and slides content in from any direction as it enters the viewport. Configurable distance, delay and replay; respects reduced-motion. Markdown: https://hirael.com/r/scroll-reveal.md. Registry JSON: https://hirael.com/r/scroll-reveal.json
- [Spotlight Card](https://hirael.com/components/animation/spotlight-card): Card surface with a crisp spotlight that tracks the cursor and fades in on hover. Built on Cursor Glow and design tokens. Markdown: https://hirael.com/r/spotlight-card.md. Registry JSON: https://hirael.com/r/spotlight-card.json
- [Magnetic Button](https://hirael.com/components/animation/magnetic-button): Button that pulls toward the cursor and springs back on leave. Adjustable strength, asChild to wrap a link, respects reduced-motion. Markdown: https://hirael.com/r/magnetic-button.md. Registry JSON: https://hirael.com/r/magnetic-button.json
- [Cursor Glow](https://hirael.com/components/animation/cursor-glow): Ambient glow layer that follows the pointer across its container and fades when it leaves. Drop it behind heroes, grids or feature panels. Markdown: https://hirael.com/r/cursor-glow.md. Registry JSON: https://hirael.com/r/cursor-glow.json
- [Sparkles](https://hirael.com/components/animation/sparkles): Canvas particle field that drifts and twinkles behind any container. Density scales with size, colors resolve from tokens, and it pauses offscreen and under reduced-motion. No dependencies. Markdown: https://hirael.com/r/sparkles.md. Registry JSON: https://hirael.com/r/sparkles.json
- [Tilt Card](https://hirael.com/components/animation/tilt-card): 3D pointer tilt with optional cursor-following glare and configurable max angle, scale and perspective. Respects reduced-motion. Markdown: https://hirael.com/r/tilt-card.md. Registry JSON: https://hirael.com/r/tilt-card.json
- [Morphing Dialog](https://hirael.com/components/animation/morphing-dialog): A trigger card that morphs into a centered dialog via shared-layout animation, with focus trapping, scroll lock, Esc to close and reduced-motion support. Markdown: https://hirael.com/r/morphing-dialog.md. Registry JSON: https://hirael.com/r/morphing-dialog.json
- [Stepper](https://hirael.com/components/navigation/stepper): Multi-step progress indicator with horizontal and vertical orientation, completed / active / inactive states, clickable steps and a compound API. Markdown: https://hirael.com/r/stepper.md. Registry JSON: https://hirael.com/r/stepper.json
- [Tour](https://hirael.com/components/navigation/tour): Onboarding spotlight that dims the page around a target element and walks users through steps with a positioned coach-mark card. Markdown: https://hirael.com/r/tour.md. Registry JSON: https://hirael.com/r/tour.json
- [Dock](https://hirael.com/components/navigation/dock): macOS-style dock with cursor magnification: icons scale and spring as the pointer passes, with hover and focus labels. Built on motion. Markdown: https://hirael.com/r/dock.md. Registry JSON: https://hirael.com/r/dock.json
- [Floating Action Button](https://hirael.com/components/navigation/floating-action-button): Expanding speed-dial FAB: a primary trigger that rotates open to stagger a stack of secondary actions on any side. Compound API. Markdown: https://hirael.com/r/floating-action-button.md. Registry JSON: https://hirael.com/r/floating-action-button.json
- [Floating Toolbar](https://hirael.com/components/navigation/floating-toolbar): Floating pill toolbar for text selection and canvas actions, with toggle buttons, separators and labels. Position it anywhere. Markdown: https://hirael.com/r/floating-toolbar.md. Registry JSON: https://hirael.com/r/floating-toolbar.json
- [Split View](https://hirael.com/components/navigation/split-view): Two-pane master/detail layout with a draggable, keyboard-accessible divider and min/max bounds, built on shadcn Resizable. Markdown: https://hirael.com/r/split-view.md. Registry JSON: https://hirael.com/r/split-view.json
- [Table of Contents](https://hirael.com/components/navigation/toc): On-this-page navigation that tracks the active heading as you scroll and highlights it with a moving border marker. Takes a flat or nested items list, or composes from parts. Smooth scroll respects reduced-motion. Markdown: https://hirael.com/r/toc.md. Registry JSON: https://hirael.com/r/toc.json
- [Command Palette](https://hirael.com/components/navigation/command-palette): Keyboard-first command menu with a platform shortcut, nested pages, remembered recents and shortcut hints on each row. Markdown: https://hirael.com/r/command-palette.md. Registry JSON: https://hirael.com/r/command-palette.json
- [Theme Toggle](https://hirael.com/components/navigation/theme-toggle): Light and dark mode controls on next-themes: a one-click toggle, a Light / Dark / System menu, and a three-way switcher with arrow-key support. Icons swap with CSS, so the button is right before hydration. Markdown: https://hirael.com/r/theme-toggle.md. Registry JSON: https://hirael.com/r/theme-toggle.json
- [Language Switcher](https://hirael.com/components/navigation/language-switcher): Locale menu that lists each language in its own script, with the translated name beside it. The trigger shows the name, the short code or just an icon, and changes report the text direction so the page can flip to RTL. Markdown: https://hirael.com/r/language-switcher.md. Registry JSON: https://hirael.com/r/language-switcher.json
- [Bottom Navigation](https://hirael.com/components/navigation/bottom-nav): A mobile tab bar with icons, labels, an active pill and count or dot badges. Items can be your router links, it can pin to the bottom clear of the home indicator, and it mirrors in RTL. Markdown: https://hirael.com/r/bottom-nav.md. Registry JSON: https://hirael.com/r/bottom-nav.json
- [Swipe Actions](https://hirael.com/components/navigation/swipe-actions): List rows that slide aside to reveal actions, like archive or delete in a mail app. Works with a finger or the mouse, leaves vertical scrolling alone, snaps open or shut, mirrors in RTL, and tabbing to an action slides it into view. Markdown: https://hirael.com/r/swipe-actions.md. Registry JSON: https://hirael.com/r/swipe-actions.json
- [Pull to Refresh](https://hirael.com/components/navigation/pull-to-refresh): A scroll area that refreshes when pulled down from the top, with a rubber-band feel, an arrow that flips when letting go will refresh, and your shadcn Spinner while it loads. Keeps the page from bouncing underneath. Markdown: https://hirael.com/r/pull-to-refresh.md. Registry JSON: https://hirael.com/r/pull-to-refresh.json
- [Reasoning](https://hirael.com/components/ai/reasoning): A collapsible panel for a model's thinking. It opens while the reasoning streams in with a shimmering label, times itself, then folds away into "Thought for 6s" once the answer starts, unless the reader opened it. Markdown: https://hirael.com/r/reasoning.md. Registry JSON: https://hirael.com/r/reasoning.json
- [Tool Call](https://hirael.com/components/ai/tool-call): Shows a tool the model called: its name, a status from pending to done, the input and output as formatted JSON, and errors. Calls that need a human get Allow and Deny buttons and stay open until answered. Markdown: https://hirael.com/r/tool-call.md. Registry JSON: https://hirael.com/r/tool-call.json
- [Sources](https://hirael.com/components/ai/sources): Citations for AI answers: numbered inline chips that preview their page on hover or focus, and a "Used 4 sources" line that opens into a list of links with their sites. Markdown: https://hirael.com/r/sources.md. Registry JSON: https://hirael.com/r/sources.json
- [Model Selector](https://hirael.com/components/ai/model-selector): A searchable model picker grouped by provider, showing each model's context size, a short description and what it can do: read images, use tools, reason or read files. Fits in a prompt toolbar. Markdown: https://hirael.com/r/model-selector.md. Registry JSON: https://hirael.com/r/model-selector.json

## Blocks
- [Hero 01](https://hirael.com/blocks/hero/hero-01): Hero sections block. Full-bleed hero card over an animated light-beam shader, with a glass pill nav, a trust badge, a serif headline, dual CTA and a three-stat footer. Markdown: https://hirael.com/r/hero-01.md. Registry JSON: https://hirael.com/r/hero-01.json
- [Hero 02](https://hirael.com/blocks/hero/hero-02): Hero sections block. Centered hero over animated gradient bars, with a release pill, a serif headline with an underlined accent, dual CTA and a wordmark strip. Markdown: https://hirael.com/r/hero-02.md. Registry JSON: https://hirael.com/r/hero-02.json
- [Hero 03](https://hirael.com/blocks/hero/hero-03): Hero sections block. Editorial centered hero on a faded grid, with a serif headline, sub-copy, dual CTA and a logo cloud of customer wordmarks. Markdown: https://hirael.com/r/hero-03.md. Registry JSON: https://hirael.com/r/hero-03.json
- [Hero 04](https://hirael.com/blocks/hero/hero-04): Hero sections block. Full-bleed image-banner hero with a dark scrim, a slim nav, a serif headline and dual CTA aligned to the bottom. Markdown: https://hirael.com/r/hero-04.md. Registry JSON: https://hirael.com/r/hero-04.json
- [Hero 05](https://hirael.com/blocks/hero/hero-05): Hero sections block. Full-bleed hero card over an animated aurora shader, with a pill nav, a live status pill, a serif headline, dual CTA and an avatar social-proof row. Markdown: https://hirael.com/r/hero-05.md. Registry JSON: https://hirael.com/r/hero-05.json
- [Hero 06](https://hirael.com/blocks/hero/hero-06): Hero sections block. Centered personal hero: a live "available for work" badge, a serif headline with a primary-tinted emphasis span, a sub-line, a three-stat row with hairline dividers, dual rounded CTAs, and a tooltip-backed core-stack icon row framed by gradient rules. Rotated geometric border accents zoom in behind it (and stay still under reduced motion). Markdown: https://hirael.com/r/hero-06.md. Registry JSON: https://hirael.com/r/hero-06.json
- [Hero 07](https://hirael.com/blocks/hero/hero-07): Hero sections block. Centered hero with a word-by-word blur-in serif headline, a glass beta badge with a live dot, dual rounded CTAs, and animated beam line-art SVGs that trace the top, bottom, and both sides of the section. Respects reduced-motion. Markdown: https://hirael.com/r/hero-07.md. Registry JSON: https://hirael.com/r/hero-07.json
- [Hero 08](https://hirael.com/blocks/hero/hero-08): Hero sections block. Centered hero on a framed, token-lit panel: a pill badge, a serif headline with an italic emphasis span, sub-copy, dual CTA buttons, and a window preview of a task board with named cards and statuses. Everything rises in with a staggered entrance that respects reduced motion. Markdown: https://hirael.com/r/hero-08.md. Registry JSON: https://hirael.com/r/hero-08.json
- [Hero 09](https://hirael.com/blocks/hero/hero-09): Hero sections block. Full-viewport product hero on a rounded card that zooms out as the page scrolls: an inline nav with brand and actions, a serif headline, sub-copy, dual CTAs, a labelled step-type strip, a drifting WebGL gradient mixed from the theme tokens, a bouncing scroll cue and a carved stat corner. Reduced-motion aware. Markdown: https://hirael.com/r/hero-09.md. Registry JSON: https://hirael.com/r/hero-09.json
- [Hero 10](https://hirael.com/blocks/hero/hero-10): Hero sections block. Bordered hero card over a blurred full-bleed image: a rocket badge, a large centered headline, sub-copy and dual CTAs that rise into place on load. Reduced-motion aware. Markdown: https://hirael.com/r/hero-10.md. Registry JSON: https://hirael.com/r/hero-10.json
- [Feature 01](https://hirael.com/blocks/features/feature-01): Features block. One bordered card of stacked stripes: a centered intro, three alternating rows pairing an indexed layer with a small deploys, previews or release-rules mockup, then a three-column primitives row and a pair of link calls to action. Markdown: https://hirael.com/r/feature-01.md. Registry JSON: https://hirael.com/r/feature-01.json
- [Feature 02](https://hirael.com/blocks/features/feature-02): Features block. Centered header above a six-item list of what every catalog item includes, laid out on hairline rows with a tabular index kicker. Markdown: https://hirael.com/r/feature-02.md. Registry JSON: https://hirael.com/r/feature-02.json
- [Feature 03](https://hirael.com/blocks/features/feature-03): Features block. Bento explaining install: a lead tile with the shadcn add command and the files it writes, beside five indexed tiles on dependencies, aliases, npm packages, tokens and runtime. Markdown: https://hirael.com/r/feature-03.md. Registry JSON: https://hirael.com/r/feature-03.json
- [Feature 04](https://hirael.com/blocks/features/feature-04): Features block. Services grid: a pill badge, title and intro over a three-column set of cards, each with a large thin icon, title, blurb and a three-point bullet list, lit by a static primary radial glow. Cards rise in with a staggered CSS entrance. Markdown: https://hirael.com/r/feature-04.md. Registry JSON: https://hirael.com/r/feature-04.json
- [Feature 05](https://hirael.com/blocks/features/feature-05): Features block. Values section: a centered header over a two-column, offset grid of six glass cards, each backed by a static dot pattern in the primary color, rising in with a staggered CSS entrance. Markdown: https://hirael.com/r/feature-05.md. Registry JSON: https://hirael.com/r/feature-05.json
- [Feature 06](https://hirael.com/blocks/features/feature-06): Features block. About section: a centered animated header over two equal story cards, each decorated with a fading SVG grid pattern and a token-lit gradient, with a heading and two paragraphs that rise in after the card. Reduced-motion renders everything in place. Markdown: https://hirael.com/r/feature-06.md. Registry JSON: https://hirael.com/r/feature-06.json
- [Feature 07](https://hirael.com/blocks/features/feature-07): Features block. Problem-framing trio: a badge and serif headline with a muted second half above three cards, each an orb icon in concentric rings with a soft radial glow, a title and a short description. Cards fade up in sequence, stilled under reduced motion. Markdown: https://hirael.com/r/feature-07.md. Registry JSON: https://hirael.com/r/feature-07.json
- [Feature 08](https://hirael.com/blocks/features/feature-08): Features block. Six-card feature grid on hairline rails: each card carries an inline icon beside its title, a title and a description, corner crosshair marks, and a radial spotlight that follows the pointer on hover. Warm-tinted top glow per card. Markdown: https://hirael.com/r/feature-08.md. Registry JSON: https://hirael.com/r/feature-08.json
- [Feature 09](https://hirael.com/blocks/features/feature-09): Features block. Selectable catalog bento on a hairline grid: step cells with a large faded icon, title and description; picking one shows its sample settings in a panel below. Crosshair frames clip at the cell edge. Markdown: https://hirael.com/r/feature-09.md. Registry JSON: https://hirael.com/r/feature-09.json
- [Feature 10](https://hirael.com/blocks/features/feature-10): Features block. Mixed-cell overview bento: a quote with attribution, two metric tiles, a latest-drop card with a CardAction, and a three-job list, all on one hairline lattice. Markdown: https://hirael.com/r/feature-10.md. Registry JSON: https://hirael.com/r/feature-10.json
- [Feature 11](https://hirael.com/blocks/features/feature-11): Features block. Feature switcher for a shared inbox: a vertical tab list of three capabilities beside a panel previewing each one, from assigned conversations to saved replies and snooze times. Arrow keys move between tabs and the panel follows. Markdown: https://hirael.com/r/feature-11.md. Registry JSON: https://hirael.com/r/feature-11.json
- [Bento 01](https://hirael.com/blocks/bento/bento-01): Bento grids block. A developer platform bento where a deploy log streams when you press Deploy, region latencies update live, and a 90-day uptime strip, install command and usage chart all respond to input. Ships composable parts. Markdown: https://hirael.com/r/bento-01.md. Registry JSON: https://hirael.com/r/bento-01.json
- [Bento 02](https://hirael.com/blocks/bento/bento-02): Bento grids block. A team collaboration bento with live presence you can follow, a comment thread you can reply to and resolve, a kanban whose cards move by drag or arrows, integration switches and notification settings with a weekly estimate. Ships composable parts. Markdown: https://hirael.com/r/bento-02.md. Registry JSON: https://hirael.com/r/bento-02.json
- [Bento 03](https://hirael.com/blocks/bento/bento-03): Bento grids block. An analytics bento where a range toggle, segment chips and saved reports drive one shared dataset, so the visitor count, funnel and country list always add up. Markdown: https://hirael.com/r/bento-03.md. Registry JSON: https://hirael.com/r/bento-03.json
- [Bento 04](https://hirael.com/blocks/bento/bento-04): Bento grids block. A security and compliance bento with a live audit trail you can pause, a role permission matrix with save and discard, a 2FA adoption meter, certificate expiry countdowns with renew, and a validated access request form. Ships composable parts. Markdown: https://hirael.com/r/bento-04.md. Registry JSON: https://hirael.com/r/bento-04.json
- [Process 01](https://hirael.com/blocks/process/process-01): How it works block. Team onboarding in three indexed steps (invite, connect tools, ship the first project), each with a primary hairline, a title, a body and a short detail line. Markdown: https://hirael.com/r/process-01.md. Registry JSON: https://hirael.com/r/process-01.json
- [Process 02](https://hirael.com/blocks/process/process-02): How it works block. Four-step install section. Picking a step fills the connector up to it and swaps in a detail panel with a short checklist, and the section closes on a copyable install command. Markdown: https://hirael.com/r/process-02.md. Registry JSON: https://hirael.com/r/process-02.json
- [Pricing 01](https://hirael.com/blocks/pricing/pricing-01): Pricing block. Three-tier card row with a monthly/yearly toggle that swaps each price and billing note, a featured middle plan, feature checklist and CTA. Markdown: https://hirael.com/r/pricing-01.md. Registry JSON: https://hirael.com/r/pricing-01.json
- [Pricing 02](https://hirael.com/blocks/pricing/pricing-02): Pricing block. Plan comparison table with grouped feature rows and a per-plan CTA in the header; on small screens a plan picker shows one plan column at a time. Markdown: https://hirael.com/r/pricing-02.md. Registry JSON: https://hirael.com/r/pricing-02.json
- [Pricing 03](https://hirael.com/blocks/pricing/pricing-03): Pricing block. Three-tier card row with a monthly/yearly billing toggle that tweens the price, a featured plan, per-plan icon, feature checklist and CTA. Markdown: https://hirael.com/r/pricing-03.md. Registry JSON: https://hirael.com/r/pricing-03.json
- [Pricing 04](https://hirael.com/blocks/pricing/pricing-04): Pricing block. Three-tier pricing row with a monthly/yearly toggle, an uppercase plan label, a large price with billing note, a tagline, a full-width CTA and a check-marked quota list; the featured tier gets a primary border, a top radial glow and a most-popular badge. Markdown: https://hirael.com/r/pricing-04.md. Registry JSON: https://hirael.com/r/pricing-04.json
- [Pricing 05](https://hirael.com/blocks/pricing/pricing-05): Pricing block. Usage pricing calculator with sliders for active users and build minutes, a priority support switch, and a live monthly estimate broken into line items with a volume tier note and monthly or yearly billing. Markdown: https://hirael.com/r/pricing-05.md. Registry JSON: https://hirael.com/r/pricing-05.json
- [Comparison 01](https://hirael.com/blocks/comparison/comparison-01): Comparison block. Two-column us-and-them panel: a featured column of checked points beside a muted column of the usual trade-offs, split by a divider that stacks on mobile. Markdown: https://hirael.com/r/comparison-01.md. Registry JSON: https://hirael.com/r/comparison-01.json
- [Comparison 02](https://hirael.com/blocks/comparison/comparison-02): Comparison block. Three-column feature matrix with a highlighted middle column, mixed tick and text cells, and a call to action in the footer row. Markdown: https://hirael.com/r/comparison-02.md. Registry JSON: https://hirael.com/r/comparison-02.json
- [Comparison 03](https://hirael.com/blocks/comparison/comparison-03): Comparison block. Before and after panels side by side, the old way muted with crosses and the new way ticked, a Before/After switch on small screens, closing on an outcome strip. Markdown: https://hirael.com/r/comparison-03.md. Registry JSON: https://hirael.com/r/comparison-03.json
- [Comparison 04](https://hirael.com/blocks/comparison/comparison-04): Comparison block. Three-plan feature matrix with a sticky plan header, a column highlight that follows the pointer, a switch that hides rows where every plan is equal, and a single-plan picker on small screens. Markdown: https://hirael.com/r/comparison-04.md. Registry JSON: https://hirael.com/r/comparison-04.json
- [Team 01](https://hirael.com/blocks/team/team-01): Team block. Team section with a serif headline, a department filter, a grid of members with portraits or initials, roles, bios and GitHub links, and a hiring footer. Ships composable parts. Markdown: https://hirael.com/r/team-01.md. Registry JSON: https://hirael.com/r/team-01.json
- [Team 02](https://hirael.com/blocks/team/team-02): Team block. Single-profile experience section: a four-up metric strip, a bio card with a grid-pattern backdrop, and a competencies card that ends in three pause-on-hover marquee rows of skill chips with edge fades. Every element rises in on scroll and respects reduced-motion. Markdown: https://hirael.com/r/team-02.md. Registry JSON: https://hirael.com/r/team-02.json
- [Team 03](https://hirael.com/blocks/team/team-03): Team block. Distributed team directory grouped by department, showing each person’s live local time and whether they are inside working hours, with a department filter and a sort by time zone. Markdown: https://hirael.com/r/team-03.md. Registry JSON: https://hirael.com/r/team-03.json
- [Stats 01](https://hirael.com/blocks/stats/stats-01): Stats block. Metrics band with four large numbers that count up on scroll, labels, optional deltas, and a two-column header on large screens. Ships composable parts. Markdown: https://hirael.com/r/stats-01.md. Registry JSON: https://hirael.com/r/stats-01.json
- [Stats 02](https://hirael.com/blocks/stats/stats-02): Stats block. Four metric tiles with a 4w, 12w or 52w range toggle that swaps each figure, trend chip and sparkline; one metric trends the wrong way. Markdown: https://hirael.com/r/stats-02.md. Registry JSON: https://hirael.com/r/stats-02.json
- [Stats 03](https://hirael.com/blocks/stats/stats-03): Stats block. Split stats section: a short growth story on one side, four metrics tracked against their targets on the other. Bars fill from zero on load and a Quarter / Year toggle swaps the figures. Markdown: https://hirael.com/r/stats-03.md. Registry JSON: https://hirael.com/r/stats-03.json
- [Testimonial 01](https://hirael.com/blocks/testimonials/testimonial-01): Testimonials block. Centered single quote with stylized open-mark, author block (avatar, name, role, company) and a muted wordmark row below. Markdown: https://hirael.com/r/testimonial-01.md. Registry JSON: https://hirael.com/r/testimonial-01.json
- [Testimonial 02](https://hirael.com/blocks/testimonials/testimonial-02): Testimonials block. Masonry quote grid (CSS columns) with ~6 bordered quote cards of varying length and author rows. Markdown: https://hirael.com/r/testimonial-02.md. Registry JSON: https://hirael.com/r/testimonial-02.json
- [Testimonial 03](https://hirael.com/blocks/testimonials/testimonial-03): Testimonials block. Centered statement quote with a serif display, an inline quote glyph in the corner, gradient hairline dividers, and a highlighted phrase, closed by a small attribution line. Markdown: https://hirael.com/r/testimonial-03.md. Registry JSON: https://hirael.com/r/testimonial-03.json
- [Testimonial 04](https://hirael.com/blocks/testimonials/testimonial-04): Testimonials block. Three-column quote grid under a centered pill badge and word-by-word headline. Each card opens with a quote mark, then the quote and an author line. Cards rise in with a short stagger. Markdown: https://hirael.com/r/testimonial-04.md. Registry JSON: https://hirael.com/r/testimonial-04.json
- [Testimonial 05](https://hirael.com/blocks/testimonials/testimonial-05): Testimonials block. Customer stories carousel where each card leads with a measured result, then a short quote, the person behind it and a link to the case study, with a slide counter and a segmented progress bar. Markdown: https://hirael.com/r/testimonial-05.md. Registry JSON: https://hirael.com/r/testimonial-05.json
- [CTA 01](https://hirael.com/blocks/cta/cta-01): Call-to-action block. Framed CTA card with headline and sub-copy on the left, and an install command with a copy button above a browse button on the right. Markdown: https://hirael.com/r/cta-01.md. Registry JSON: https://hirael.com/r/cta-01.json
- [CTA 02](https://hirael.com/blocks/cta/cta-02): Call-to-action block. Full-bleed centered CTA with framing top/bottom rules, highlight underlay on the key word, and an install command with a copy button. Markdown: https://hirael.com/r/cta-02.md. Registry JSON: https://hirael.com/r/cta-02.json
- [CTA 03](https://hirael.com/blocks/cta/cta-03): Call-to-action block. Full-bleed CTA card with an animated dithered shader backdrop, an eyebrow pill, a serif headline and a pill action button. Markdown: https://hirael.com/r/cta-03.md. Registry JSON: https://hirael.com/r/cta-03.json
- [CTA 04](https://hirael.com/blocks/cta/cta-04): Call-to-action block. Centered get-in-touch CTA with a pill eyebrow, serif headline, mail button, a copy-to-clipboard email address, and GitHub and LinkedIn icon buttons, capped by a soft radial glow dome with a starfield speckle. Markdown: https://hirael.com/r/cta-04.md. Registry JSON: https://hirael.com/r/cta-04.json
- [CTA 05](https://hirael.com/blocks/cta/cta-05): Call-to-action block. Contact CTA panel with a scroll-reactive radial glow, an eyebrow badge, a word-by-word reveal headline, and two contact actions (email and call) each pairing a button with its detail line. Markdown: https://hirael.com/r/cta-05.md. Registry JSON: https://hirael.com/r/cta-05.json
- [CTA 06](https://hirael.com/blocks/cta/cta-06): Call-to-action block. CTA banner on one tokenized gradient surface: an eyebrow label, a serif headline with an italic emphasis, short sub-copy, and a primary action button that rises in. Markdown: https://hirael.com/r/cta-06.md. Registry JSON: https://hirael.com/r/cta-06.json
- [CTA 07](https://hirael.com/blocks/cta/cta-07): Call-to-action block. Closing CTA panel wrapped in a scroll-reactive primary rim glow that widens as the section moves through the viewport, with an eyebrow badge, a two-tone serif headline, sub-copy and dual CTAs. Static glow under reduced motion. Markdown: https://hirael.com/r/cta-07.md. Registry JSON: https://hirael.com/r/cta-07.json
- [Newsletter 01](https://hirael.com/blocks/newsletter/newsletter-01): Newsletter block. Centered subscribe panel with an inline email form, inline validation and a success state that swaps in a confirmation once a valid address is entered. Markdown: https://hirael.com/r/newsletter-01.md. Registry JSON: https://hirael.com/r/newsletter-01.json
- [Newsletter 02](https://hirael.com/blocks/newsletter/newsletter-02): Newsletter block. Waitlist form that validates the address, shows a brief loading state, then returns your place in line with an invite link to copy and the referral rewards it unlocks. Markdown: https://hirael.com/r/newsletter-02.md. Registry JSON: https://hirael.com/r/newsletter-02.json
- [FAQ 01](https://hirael.com/blocks/faqs/faq-01): FAQ block. Two-column FAQ: sticky heading and a hairline help note on the start side, numbered accordion on the end side. Markdown: https://hirael.com/r/faq-01.md. Registry JSON: https://hirael.com/r/faq-01.json
- [FAQ 02](https://hirael.com/blocks/faqs/faq-02): FAQ block. Centered heading with two-column accordion grid below. Each row tagged with a Qn index. Markdown: https://hirael.com/r/faq-02.md. Registry JSON: https://hirael.com/r/faq-02.json
- [FAQ 03](https://hirael.com/blocks/faqs/faq-03): FAQ block. Searchable FAQ with category tabs, a live-filtered accordion, an empty state for missed queries and a support CTA strip. Markdown: https://hirael.com/r/faq-03.md. Registry JSON: https://hirael.com/r/faq-03.json
- [FAQ 04](https://hirael.com/blocks/faqs/faq-04): FAQ block. Framed single-column FAQ with side rules, a centered display header with a topic jump nav, five topic groups each pairing a heading with its own accordion, and a support footer line. Markdown: https://hirael.com/r/faq-04.md. Registry JSON: https://hirael.com/r/faq-04.json
- [FAQ 05](https://hirael.com/blocks/faqs/faq-05): FAQ block. Two-column FAQ block: an eyebrow, serif headline and short intro sit on the start side; a single-open accordion of five questions sits on the end side, split by a vertical divider that collapses to a stacked layout on mobile. Markdown: https://hirael.com/r/faq-05.md. Registry JSON: https://hirael.com/r/faq-05.json
- [FAQ 06](https://hirael.com/blocks/faqs/faq-06): FAQ block. Centered FAQ with a pill badge, a word-by-word headline reveal and a short intro above a multi-open accordion where each question is its own bordered card that rises in with a staggered delay and tints slightly when open. Ships composable parts. Markdown: https://hirael.com/r/faq-06.md. Registry JSON: https://hirael.com/r/faq-06.json
- [FAQ 07](https://hirael.com/blocks/faqs/faq-07): FAQ block. Split FAQ: a heading, lead and numbered topic index on the start side; picking a topic opens its answer in the single-open accordion on the end side. Markdown: https://hirael.com/r/faq-07.md. Registry JSON: https://hirael.com/r/faq-07.json
- [Login 01](https://hirael.com/blocks/auth/login-01): Auth block. Centered sign-in: logo and heading above a card with email, password and an inline forgot-password link, a passkey option, an alert for failed attempts and a create-account line below. Markdown: https://hirael.com/r/login-01.md. Registry JSON: https://hirael.com/r/login-01.json
- [Login 02](https://hirael.com/blocks/auth/login-02): Auth block. Split login with a testimonial pane. The form leads with Google and GitHub, then email and password with an inline forgot link and an alert for failed attempts. The pane holds a quote and two results over a world map drawn in the foreground token. Markdown: https://hirael.com/r/login-02.md. Registry JSON: https://hirael.com/r/login-02.json
- [Login 03](https://hirael.com/blocks/auth/login-03): Auth block. Split-screen sign-in: a decorative animated-paths aside with a brand mark and a short quote, paired with a clean GitHub-only sign-in pane. A back-to-home link, mobile-collapsing layout, and token-based radial glows behind the form. Markdown: https://hirael.com/r/login-03.md. Registry JSON: https://hirael.com/r/login-03.json
- [Login 04](https://hirael.com/blocks/auth/login-04): Auth block. Identifier-first sign-in in one wide card: heading on one side, fields on the other. Email first, then password, with an account chip to switch back and a hidden username field so password managers fill the right account. Markdown: https://hirael.com/r/login-04.md. Registry JSON: https://hirael.com/r/login-04.json
- [Login 05](https://hirael.com/blocks/auth/login-05): Auth block. Provider-first sign-in: stacked Continue with GitHub, Google and Apple buttons, plus email and passkey options. Email sends a magic link and swaps to a check-your-email state. Markdown: https://hirael.com/r/login-05.md. Registry JSON: https://hirael.com/r/login-05.json
- [Sign Up 01](https://hirael.com/blocks/auth/signup-01): Auth block. Centered signup card: GitHub and Google first, then name, email and a password with a strength meter and hint. Terms sit under the card as plain text, and submitting swaps to a check-your-email state. Markdown: https://hirael.com/r/signup-01.md. Registry JSON: https://hirael.com/r/signup-01.json
- [Forgot Password 01](https://hirael.com/blocks/auth/forgot-password-01): Auth block. Centered reset request: one email field with inline validation, then a check-your-email state that echoes the address, links back to sign in and offers a resend. Markdown: https://hirael.com/r/forgot-password-01.md. Registry JSON: https://hirael.com/r/forgot-password-01.json
- [OTP Verify 01](https://hirael.com/blocks/auth/otp-verify-01): Auth block. Centered verification card built on InputOTP: six slots that fit a phone screen, paste support, auto-verify on the last digit, a 30s resend countdown and a verified state. Markdown: https://hirael.com/r/otp-verify-01.md. Registry JSON: https://hirael.com/r/otp-verify-01.json
- [Two-Factor Setup 01](https://hirael.com/blocks/auth/two-factor-setup-01): Auth block. Three-step 2FA enrollment card: scan a real otpauth QR or copy the key, confirm a six-digit code, then save recovery codes with copy, download and a checkbox-gated finish. Ships composable parts. Markdown: https://hirael.com/r/two-factor-setup-01.md. Registry JSON: https://hirael.com/r/two-factor-setup-01.json
- [Header 01](https://hirael.com/blocks/header/header-01): Headers block. Sticky top nav with brand monogram, centered anchor links, dual auth CTAs and a slide-down mobile menu. Markdown: https://hirael.com/r/header-01.md. Registry JSON: https://hirael.com/r/header-01.json
- [Header 02](https://hirael.com/blocks/header/header-02): Headers block. Floating nav that runs full width at the top of the page and shrinks into a blurred pill once you scroll past 100px, with a spring-animated width change. Links share a sliding hover highlight; on mobile a toggle opens an animated dropdown menu. Ships composable parts and a scroll-container prop for embedded layouts. Markdown: https://hirael.com/r/header-02.md. Registry JSON: https://hirael.com/r/header-02.json
- [Header 03](https://hirael.com/blocks/header/header-03): Headers block. Sticky marketing header with Product, Solutions and Resources mega menus, each a two-column link list beside a featured entry, plain Pricing and Docs links, and a side sheet with collapsible groups on small screens. Markdown: https://hirael.com/r/header-03.md. Registry JSON: https://hirael.com/r/header-03.json
- [Footer 01](https://hirael.com/blocks/footer/footer-01): Footers block. Brand + tagline column alongside Product / Company / Resources link columns, with a copyright row and social icons below a thin rule. Markdown: https://hirael.com/r/footer-01.md. Registry JSON: https://hirael.com/r/footer-01.json
- [Footer 02](https://hirael.com/blocks/footer/footer-02): Footers block. Rounded-top footer with a brand block beside a multi-column link grid. Each column caps at five links and shows a "View all" arrow when there are more. A soft radial tint sits behind the top edge, and a bottom meta row carries the copyright and secondary links. Markdown: https://hirael.com/r/footer-02.md. Registry JSON: https://hirael.com/r/footer-02.json
- [Footer 03](https://hirael.com/blocks/footer/footer-03): Footers block. Boxed link-column footer: a two-column brand block with wordmark, blurb, and ghost social buttons, two link columns, and a divided copyright row. Sits in a soft outlined panel. Markdown: https://hirael.com/r/footer-03.md. Registry JSON: https://hirael.com/r/footer-03.json
- [Footer 04](https://hirael.com/blocks/footer/footer-04): Footers block. Four-column footer lit by slow light rays falling from the top edge: brand mark and blurb, a contact column with WhatsApp and email links, a location column, and a subscribe form whose placeholder cycles through prompts. Columns and links rise in with staggered motion; a divided copyright row closes it. Rays hold still under reduced-motion. Markdown: https://hirael.com/r/footer-04.md. Registry JSON: https://hirael.com/r/footer-04.json
- [Footer 05](https://hirael.com/blocks/footer/footer-05): Footers block. Floating card footer inset from the page edge: a brand block with mark and tagline, three link columns, and a hairline-divided legal row with copyright and a sign-off line. Markdown: https://hirael.com/r/footer-05.md. Registry JSON: https://hirael.com/r/footer-05.json
- [Footer 06](https://hirael.com/blocks/footer/footer-06): Footers block. Two-part footer: a bordered CTA panel over a rotated, blurred image with a headline, sub-copy and a wide sign-up button, above a brand block with social icons, two link columns and a hairline copyright row. Markdown: https://hirael.com/r/footer-06.md. Registry JSON: https://hirael.com/r/footer-06.json
- [Not Found 01](https://hirael.com/blocks/not-found/not-found-01): Status pages block. Centered 404 with mono eyebrow, display headline, paired CTAs and a 'try one of these' suggested-routes list. Markdown: https://hirael.com/r/not-found-01.md. Registry JSON: https://hirael.com/r/not-found-01.json
- [Not Found 02](https://hirael.com/blocks/not-found/not-found-02): Status pages block. A 404 page framed by side rails, with a photo, an error code, a home link and a band of popular pages. Ships composable parts. Markdown: https://hirael.com/r/not-found-02.md. Registry JSON: https://hirael.com/r/not-found-02.json
- [Status 01](https://hirael.com/blocks/not-found/status-01): Status pages block. Service status page: an operational banner with an inline check, a 90-day uptime grid of tooltip-backed day bars per service with a status legend, and a dated incident history where each update carries a tone-colored badge, a timestamp and a note. Markdown: https://hirael.com/r/status-01.md. Registry JSON: https://hirael.com/r/status-01.json
- [Status 02](https://hirael.com/blocks/not-found/status-02): Status pages block. Service health cards in a responsive grid: each with a status dot, a response-time sparkline tinted by state, a status label, and an uptime and response stat pair. One service runs degraded. Markdown: https://hirael.com/r/status-02.md. Registry JSON: https://hirael.com/r/status-02.json
- [Coming Soon 01](https://hirael.com/blocks/not-found/coming-soon-01): Status pages block. Full-viewport launch page with a live countdown, an email notify form that shows an inline success state, and a GitHub link in the footer. Ships composable parts. Markdown: https://hirael.com/r/coming-soon-01.md. Registry JSON: https://hirael.com/r/coming-soon-01.json
- [Coming Soon 02](https://hirael.com/blocks/not-found/coming-soon-02): Status pages block. Full-viewport launch teaser: a pill badge, a word-by-word serif headline, sub-copy and an email notify form with inline validation and a confirmation, above a glowing horizon of sparkles with a rounded planet edge. Motion respects reduced-motion. Markdown: https://hirael.com/r/coming-soon-02.md. Registry JSON: https://hirael.com/r/coming-soon-02.json
- [Maintenance 01](https://hirael.com/blocks/not-found/maintenance-01): Status pages block. Scheduled maintenance page with a pulsing status dot, window card showing start, expected return and migration progress, a notify-me popover with email validation, a status page link and a timestamped updates list. Ships composable parts. Markdown: https://hirael.com/r/maintenance-01.md. Registry JSON: https://hirael.com/r/maintenance-01.json
- [Maintenance 02](https://hirael.com/blocks/not-found/maintenance-02): Status pages block. Full-viewport offline page with a blurred primary glow and a sparkle field behind a pill badge, a word-by-word serif headline, a short status message and a spinner line. Message area is a live region. Markdown: https://hirael.com/r/maintenance-02.md. Registry JSON: https://hirael.com/r/maintenance-02.json
- [Error 01](https://hirael.com/blocks/not-found/error-01): Status pages block. 500 page with a retry action, home link, collapsible technical details (request id, timestamp, copy button) and a system status line. Ships composable parts. Markdown: https://hirael.com/r/error-01.md. Registry JSON: https://hirael.com/r/error-01.json
- [Logo Cloud 01](https://hirael.com/blocks/logo-cloud/logo-cloud-01): Logo cloud block. Centered eyebrow + headline above a 6-column bordered wordmark grid, with stat strip and case-study link below. Markdown: https://hirael.com/r/logo-cloud-01.md. Registry JSON: https://hirael.com/r/logo-cloud-01.json
- [Logo Cloud 02](https://hirael.com/blocks/logo-cloud/logo-cloud-02): Logo cloud block. Two full-bleed marquee rows of wordmarks running in opposite directions, edges faded into the page, each row holding still on hover. Markdown: https://hirael.com/r/logo-cloud-02.md. Registry JSON: https://hirael.com/r/logo-cloud-02.json
- [Logo Cloud 03](https://hirael.com/blocks/logo-cloud/logo-cloud-03): Logo cloud block. Quiet single-row wordmark strip that brightens on hover, a rule, then a pull quote with an avatar and attribution. Markdown: https://hirael.com/r/logo-cloud-03.md. Registry JSON: https://hirael.com/r/logo-cloud-03.json
- [Logo Cloud 04](https://hirael.com/blocks/logo-cloud/logo-cloud-04): Logo cloud block. Six customer wordmarks as tabs, each opening a proof panel with a metric, a short quote and a story link. It advances on its own, pauses on hover or focus, and stops once you pick one. Markdown: https://hirael.com/r/logo-cloud-04.md. Registry JSON: https://hirael.com/r/logo-cloud-04.json
- [Contact 01](https://hirael.com/blocks/contact/contact-01): Contact block. Production contact form with controlled state, inline validation, character counter, topic select, consent checkbox and a pending/sent state machine. Channel list and remote-location note alongside. Markdown: https://hirael.com/r/contact-01.md. Registry JSON: https://hirael.com/r/contact-01.json
- [Contact 02](https://hirael.com/blocks/contact/contact-02): Contact block. Bordered contact section with a serif header and a three-column info grid: email with a copy button, location, and social pills. Markdown: https://hirael.com/r/contact-02.md. Registry JSON: https://hirael.com/r/contact-02.json
- [Contact 03](https://hirael.com/blocks/contact/contact-03): Contact block. Centered contact panel whose bottom glow widens as the section scrolls into view, with a pill badge, a word-by-word headline reveal, two short paragraphs, and a two-column CTA grid: an email button with the address and a copy button beneath it and an outline call button that opens a WhatsApp chat. Ships composable parts. Markdown: https://hirael.com/r/contact-03.md. Registry JSON: https://hirael.com/r/contact-03.json
- [Contact 04](https://hirael.com/blocks/contact/contact-04): Contact block. Support contact section with a live reply-time line from fixed support hours, contact channels, common questions, and a ticket form that suggests help articles as you type the subject. Markdown: https://hirael.com/r/contact-04.md. Registry JSON: https://hirael.com/r/contact-04.json
- [Careers 01](https://hirael.com/blocks/careers/careers-01): Careers block. Open-roles list with department filter pills and rows that show title, department, location and type, each linking out with a hover arrow. Markdown: https://hirael.com/r/careers-01.md. Registry JSON: https://hirael.com/r/careers-01.json
- [Careers 02](https://hirael.com/blocks/careers/careers-02): Careers block. Single job posting with the role details, a numbered hiring process and a sticky apply form with CV upload, validation and a success state. On small screens a sticky button jumps to the form. Markdown: https://hirael.com/r/careers-02.md. Registry JSON: https://hirael.com/r/careers-02.json
- [Blog 01](https://hirael.com/blocks/blog/blog-01): Blog block. Editorial blog index with a featured post on top and a 4-column grid of post cards underneath. Built on Card and Badge. Markdown: https://hirael.com/r/blog-01.md. Registry JSON: https://hirael.com/r/blog-01.json
- [Blog 02](https://hirael.com/blocks/blog/blog-02): Blog block. Editorial post index as dated rows with a thumbnail that surfaces on hover, category tabs with counts that filter the list, and an empty state for a category with nothing in it yet. Markdown: https://hirael.com/r/blog-02.md. Registry JSON: https://hirael.com/r/blog-02.json
- [Ecommerce 01](https://hirael.com/blocks/ecommerce/ecommerce-01): E-commerce block. Product grid with category filter pills, sale and new badges, wishlist toggles, star ratings, compare-at pricing and add-to-cart buttons that update a live cart count. Markdown: https://hirael.com/r/ecommerce-01.md. Registry JSON: https://hirael.com/r/ecommerce-01.json
- [Ecommerce 02](https://hirael.com/blocks/ecommerce/ecommerce-02): E-commerce block. Shopping cart with capped quantity steppers, animated line-item removal, promo-code validation, a free-shipping threshold, live totals, a checkout that confirms with an order number, and an empty-cart state. Markdown: https://hirael.com/r/ecommerce-02.md. Registry JSON: https://hirael.com/r/ecommerce-02.json
- [Ecommerce 03](https://hirael.com/blocks/ecommerce/ecommerce-03): E-commerce block. Product detail page with a thumbnail gallery, colour swatches, a size grid that knows what is sold out in each colour, a stock-capped quantity stepper, add to cart, and details in an accordion. Markdown: https://hirael.com/r/ecommerce-03.md. Registry JSON: https://hirael.com/r/ecommerce-03.json
- [Ecommerce 04](https://hirael.com/blocks/ecommerce/ecommerce-04): E-commerce block. Category page with a sticky filter sidebar (category counts that react to the other filters, price range, colour, stock, rating), removable filter chips, sorting, an empty state, and a filter sheet on small screens. Markdown: https://hirael.com/r/ecommerce-04.md. Registry JSON: https://hirael.com/r/ecommerce-04.json
- [Dashboard 01](https://hirael.com/blocks/dashboard/dashboard-01): Dashboard block. Operations dashboard with a Tabs date-range switcher (1d / 7d / 30d / 90d), a 4-up metric strip, a weekly bar chart and a recent-activity feed. Every metric declares which direction is good news, so falling churn reads green; each chart bucket is a focusable control, so the numbers reach the keyboard as well as the mouse. Markdown: https://hirael.com/r/dashboard-01.md. Registry JSON: https://hirael.com/r/dashboard-01.json
- [Dashboard 02](https://hirael.com/blocks/dashboard/dashboard-02): Dashboard block. Analytics dashboard with a date-range select, four sparkline KPI tiles, a layered two-series area chart and top-pages and channel-share side cards. Deltas carry their own unit (percent vs percentage points) and the direction that counts as good, and the area chart ships a screen-reader data table of the same numbers. Markdown: https://hirael.com/r/dashboard-02.md. Registry JSON: https://hirael.com/r/dashboard-02.json
- [Dashboard 03](https://hirael.com/blocks/dashboard/dashboard-03): Dashboard block. Revenue dashboard with a month stepper, a plan-mix donut and legend, an invoice status list and a paginated transactions list. Amounts are numbers formatted through Intl, and every colour comes from a lookup keyed by plan or status, so no Tailwind class is stored in the data. Markdown: https://hirael.com/r/dashboard-03.md. Registry JSON: https://hirael.com/r/dashboard-03.json
- [Dashboard 04](https://hirael.com/blocks/dashboard/dashboard-04): Dashboard block. Commerce operations dashboard in a card-in-card style: four inset stat tiles, a Today band pairing an hourly two-series revenue chart with ad-budget and peak-hours cards, and a week-in-review band driven by a range select. The budget bar is a real progressbar, both charts ship a screen-reader data table, and each panel only shows an action when it has one. Markdown: https://hirael.com/r/dashboard-04.md. Registry JSON: https://hirael.com/r/dashboard-04.json
- [Dashboard 05](https://hirael.com/blocks/dashboard/dashboard-05): Dashboard block. Observability dashboard composed as one bordered lattice: greeting strip with range select, four sparkline KPI cells, cache and duration chart cells, an AI-insight callout, a P50/P95/P99 latency distribution measured against a stated target, and an active-deployments list. The deployment taking traffic is marked in the primary color and its pulse respects prefers-reduced-motion. Markdown: https://hirael.com/r/dashboard-05.md. Registry JSON: https://hirael.com/r/dashboard-05.json
- [Dashboard 06](https://hirael.com/blocks/dashboard/dashboard-06): Dashboard block. Pipeline overview dashboard: four stat cards for success, failure, skipped, and live activity, a clickable latest-runs bar chart with a run breakdown panel, and a recent-runs list. The active-now stat uses the primary color for live state; every color is a theme token, so it works in light and dark. Markdown: https://hirael.com/r/dashboard-06.md. Registry JSON: https://hirael.com/r/dashboard-06.json
- [Integrations 01](https://hirael.com/blocks/integrations/integrations-01): Integrations block. Two-column integrations section with copy and a linked integration list on the left, and an orbit diagram (central hub with 6 spokes) on the right that highlights the spoke you hover. Markdown: https://hirael.com/r/integrations-01.md. Registry JSON: https://hirael.com/r/integrations-01.json
- [Integrations 02](https://hirael.com/blocks/integrations/integrations-02): Integrations block. Filterable connector grid: a category toggle group above a card grid, where each card connects or disconnects with a pending state and a running connected count. Markdown: https://hirael.com/r/integrations-02.md. Registry JSON: https://hirael.com/r/integrations-02.json
- [Integrations 03](https://hirael.com/blocks/integrations/integrations-03): Integrations block. Two-column integrations page: a sticky intro with a request-an-integration popover form beside a ruled list of linked connectors and their status. Markdown: https://hirael.com/r/integrations-03.md. Registry JSON: https://hirael.com/r/integrations-03.json
- [Integrations 04](https://hirael.com/blocks/integrations/integrations-04): Integrations block. Centered integrations section: heading and copy above a hub with 6 linked tool tiles on straight spokes, with pulses travelling in and out along each line. Markdown: https://hirael.com/r/integrations-04.md. Registry JSON: https://hirael.com/r/integrations-04.json
- [Integrations 05](https://hirael.com/blocks/integrations/integrations-05): Integrations block. Centered integrations section with three source tools on one side and three targets on the other, joined to a central hub by curved paths that carry travelling pulses. Markdown: https://hirael.com/r/integrations-05.md. Registry JSON: https://hirael.com/r/integrations-05.json
- [Integrations 06](https://hirael.com/blocks/integrations/integrations-06): Integrations block. Centered integrations section with a row of tool tiles hung on a shallow arc over a faded grid, each lifting on hover. Markdown: https://hirael.com/r/integrations-06.md. Registry JSON: https://hirael.com/r/integrations-06.json
- [Integrations 07](https://hirael.com/blocks/integrations/integrations-07): Integrations block. Two-column integrations section with copy and a call to action beside a 3 by 3 tile grid whose featured tile cycles on its own, pauses on hover and focus, and can be picked directly. Markdown: https://hirael.com/r/integrations-07.md. Registry JSON: https://hirael.com/r/integrations-07.json
- [Integrations 08](https://hirael.com/blocks/integrations/integrations-08): Integrations block. Minimal integrations section: a short heading, a single row of tool icons and a link to the full list. Markdown: https://hirael.com/r/integrations-08.md. Registry JSON: https://hirael.com/r/integrations-08.json
- [Image Gallery 01](https://hirael.com/blocks/image-gallery/image-gallery-01): Image gallery block. Studio-style masonry gallery with a Tabs category filter showing counts, photo tiles in varied aspect ratios that open in a lightbox with thumbnails, and an empty state for categories with no work yet. Markdown: https://hirael.com/r/image-gallery-01.md. Registry JSON: https://hirael.com/r/image-gallery-01.json
- [Image Gallery 02](https://hirael.com/blocks/image-gallery/image-gallery-02): Image gallery block. Photo grid with a Grid and Rows layout switch, captions on hover or focus, and a lightbox with thumbnails that opens at the chosen photo and returns focus to it on close. Markdown: https://hirael.com/r/image-gallery-02.md. Registry JSON: https://hirael.com/r/image-gallery-02.json
- [App Shell 01](https://hirael.com/blocks/app-shell/app-shell-01): App shell block. Drop-in admin shell built on the shadcn Sidebar primitive: collapsible icon rail with nav badges and an account menu in the footer, sticky topbar with breadcrumb and a ⌘K search that really focuses, plus an accounts table that filters live and sorts by any column with aria-sort. Markdown: https://hirael.com/r/app-shell-01.md. Registry JSON: https://hirael.com/r/app-shell-01.json
- [App Shell 02](https://hirael.com/blocks/app-shell/app-shell-02): App shell block. Sidebar-free admin shell with a sticky top bar over a working settings screen: vertical tabs with roving keyboard focus, a header search that filters every section and counts matches per tab, and rows that actually do their thing (inline edit, copy to clipboard, or a switch) with a live save status. Markdown: https://hirael.com/r/app-shell-02.md. Registry JSON: https://hirael.com/r/app-shell-02.json
- [App Shell 03](https://hirael.com/blocks/app-shell/app-shell-03): App shell block. Split-pane inbox shell: icon rail with unread indicator, a searchable conversation listbox you can walk with the arrow keys, and a reading pane where star, archive and delete all work, with undo. Collapses to one pane on phones with a back button, and the composer sends on ⌘+Enter so Enter still makes a new line. Markdown: https://hirael.com/r/app-shell-03.md. Registry JSON: https://hirael.com/r/app-shell-03.json
- [App Shell 04](https://hirael.com/blocks/app-shell/app-shell-04): App shell block. Starter shell on the shadcn Sidebar primitive (inset variant): a workspace switcher that switches, a ⌘K field that filters the nav, icon-collapsible items with tooltips, an inset header with an account menu and notification count, and a campaign board overview with a stat row and four stage columns. Markdown: https://hirael.com/r/app-shell-04.md. Registry JSON: https://hirael.com/r/app-shell-04.json
- [App Shell 05](https://hirael.com/blocks/app-shell/app-shell-05): App shell block. Inset sidebar app shell: a collapsible icon sidebar with a brand header, grouped Workspace and Tools nav (with a Beta badge), and an account menu in the footer, paired with a sticky header carrying the sidebar toggle and a breadcrumb. The inset holds a documents list with status filters that actually filter. Markdown: https://hirael.com/r/app-shell-05.md. Registry JSON: https://hirael.com/r/app-shell-05.json
- [App Shell 06](https://hirael.com/blocks/app-shell/app-shell-06): App shell block. A nested app sidebar for shadcn/ui. Open a project or settings and the whole sidebar slides to its own links, like the Vercel dashboard, instead of expanding a dropdown. A back row slides out again, the breadcrumb follows the path, and multi-level menus go as deep as you need. Built from sidebar tokens, so it takes on your theme. Markdown: https://hirael.com/r/app-shell-06.md. Registry JSON: https://hirael.com/r/app-shell-06.json
- [Server Card](https://hirael.com/blocks/cloud/server-card): Cloud block. Fleet of host cards, each with a status pill, region, CPU / memory / disk specs and threshold-tinted usage meters. Ships composable parts. Markdown: https://hirael.com/r/server-card.md. Registry JSON: https://hirael.com/r/server-card.json
- [VM Table](https://hirael.com/blocks/cloud/vm-table): Cloud block. Virtual-machine instance table with live status dots, size, region, IP and uptime. Self-contained parts, no table primitive required. Markdown: https://hirael.com/r/vm-table.md. Registry JSON: https://hirael.com/r/vm-table.json
- [Kubernetes Pod Table](https://hirael.com/blocks/cloud/k8s-pod-table): Cloud block. Kubernetes pod table with phase pills (Running, Pending, CrashLoopBackOff), ready and restart counts that flag unhealthy pods. Markdown: https://hirael.com/r/k8s-pod-table.md. Registry JSON: https://hirael.com/r/k8s-pod-table.json
- [Resource Status](https://hirael.com/blocks/cloud/resource-status): Cloud block. Statuspage-style panel: an overall banner over a list of resources, each with an operational / degraded / outage / maintenance state and uptime. Markdown: https://hirael.com/r/resource-status.md. Registry JSON: https://hirael.com/r/resource-status.json
- [Cluster Map](https://hirael.com/blocks/cloud/cluster-map): Cloud block. Grid heatmap of cluster nodes, each cell tinted by health and load with a hover label, plus a legend. Ships composable parts. Markdown: https://hirael.com/r/cluster-map.md. Registry JSON: https://hirael.com/r/cluster-map.json
- [Network Topology](https://hirael.com/blocks/cloud/network-topology): Cloud block. Coordinate-placed topology diagram: nodes with status and icons over an SVG edge layer, with animated active links. Ships composable parts. Markdown: https://hirael.com/r/network-topology.md. Registry JSON: https://hirael.com/r/network-topology.json
- [Storage Browser](https://hirael.com/blocks/cloud/storage-browser): Cloud block. Object-storage file browser with a clickable path breadcrumb, folder and file rows, sizes and modified dates, and a details row for the selected file. Ships composable parts. Markdown: https://hirael.com/r/storage-browser.md. Registry JSON: https://hirael.com/r/storage-browser.json
- [Log Viewer](https://hirael.com/blocks/cloud/log-viewer): Cloud block. Streaming log panel with severity-colored lines, timestamps and sources, a level filter with counts, and a Follow toggle that tails new lines and unpins when you scroll up. Ships composable parts. Markdown: https://hirael.com/r/log-viewer.md. Registry JSON: https://hirael.com/r/log-viewer.json
- [Terminal](https://hirael.com/blocks/cloud/terminal): Cloud block. Terminal surface with a title bar, output lines and an interactive prompt input with command-history recall. Ships composable parts. Markdown: https://hirael.com/r/terminal.md. Registry JSON: https://hirael.com/r/terminal.json
- [Deployment History](https://hirael.com/blocks/cloud/deployment-history): Cloud block. Deployment feed on a connecting rail: version, environment and status (deployed, failed, building, rolled back) with commit and author meta. Markdown: https://hirael.com/r/deployment-history.md. Registry JSON: https://hirael.com/r/deployment-history.json
- [Env Variables Editor](https://hirael.com/blocks/cloud/env-editor): Cloud block. Environment variables editor with masked secrets, copy, per-environment chips, .env import, key validation, and unsaved-change tracking. Ships composable parts. Markdown: https://hirael.com/r/env-editor.md. Registry JSON: https://hirael.com/r/env-editor.json
- [Audit Log](https://hirael.com/blocks/saas/audit-log): SaaS block. Compliance-style event log with expandable rows that reveal actor, action, status and request metadata. Composable disclosure parts. Markdown: https://hirael.com/r/audit-log.md. Registry JSON: https://hirael.com/r/audit-log.json
- [Billing Card](https://hirael.com/blocks/saas/billing-card): SaaS block. Current-plan summary with price, a usage meter, billing detail rows and footer actions. Composable parts for billing settings. Markdown: https://hirael.com/r/billing-card.md. Registry JSON: https://hirael.com/r/billing-card.json
- [Subscription Plans](https://hirael.com/blocks/saas/subscription-plans): SaaS block. In-app plan selector with featured and current states, a badge, feature checklist and per-plan action. Ships composable parts. Markdown: https://hirael.com/r/subscription-plans.md. Registry JSON: https://hirael.com/r/subscription-plans.json
- [API Keys](https://hirael.com/blocks/saas/api-keys): SaaS block. API key manager with reveal/hide, copy-to-clipboard, key metadata and a create action. Ships composable parts. Markdown: https://hirael.com/r/api-keys.md. Registry JSON: https://hirael.com/r/api-keys.json
- [Usage Dashboard](https://hirael.com/blocks/saas/usage-dashboard): SaaS block. Metered usage panel with per-resource progress bars that tint amber near the limit and red over it. Ships composable parts. Markdown: https://hirael.com/r/usage-dashboard.md. Registry JSON: https://hirael.com/r/usage-dashboard.json
- [Settings 01](https://hirael.com/blocks/saas/settings-01): SaaS block. Account settings page with a sticky section nav, card sections with label/control rows that stack on mobile, dirty-aware Save/Cancel footers, and a Danger zone with an alert-dialog confirm. Ships composable parts. Markdown: https://hirael.com/r/settings-01.md. Registry JSON: https://hirael.com/r/settings-01.json
- [Settings 02](https://hirael.com/blocks/saas/settings-02): SaaS block. Security and notifications settings in tabs: change password with strength meter, two-factor toggle, revocable session list, and grouped notification switches under a Pause all master. Ships composable parts. Markdown: https://hirael.com/r/settings-02.md. Registry JSON: https://hirael.com/r/settings-02.json
- [Members 01](https://hirael.com/blocks/saas/members-01): SaaS block. Team members management: live search, inline role select, status badges, row actions menu, a pending-invites list with resend/revoke, and an invite dialog that validates emails as tags. Ships composable parts. Markdown: https://hirael.com/r/members-01.md. Registry JSON: https://hirael.com/r/members-01.json
- [Onboarding 01](https://hirael.com/blocks/saas/onboarding-01): SaaS block. Four-step setup wizard on the Stepper: controlled or uncontrolled step, per-step validation gating Continue, Skip, Back, a Finish that fires onComplete, and a fade between steps. Ships composable parts. Markdown: https://hirael.com/r/onboarding-01.md. Registry JSON: https://hirael.com/r/onboarding-01.json
- [Prompt Input](https://hirael.com/blocks/ai/prompt-input): AI block. Chat composer with an auto-growing textarea, Enter to send, attachments, a model picker, and a Stop button while streaming. Ships composable parts. Markdown: https://hirael.com/r/prompt-input.md. Registry JSON: https://hirael.com/r/prompt-input.json
- [Message Thread](https://hirael.com/blocks/ai/message-thread): AI block. Message list that follows streaming output, with tool calls, reasoning, sources, hover actions, typing dots, and a streaming cursor. Ships composable parts. Markdown: https://hirael.com/r/message-thread.md. Registry JSON: https://hirael.com/r/message-thread.json
- [AI Chat 01](https://hirael.com/blocks/ai/ai-chat-01): AI block. Full chat screen: grouped history sidebar that collapses to a sheet, top bar with model badge, streaming thread, and pinned composer. Ships composable parts. Markdown: https://hirael.com/r/ai-chat-01.md. Registry JSON: https://hirael.com/r/ai-chat-01.json
- [Activity Feed](https://hirael.com/blocks/widgets/activity-feed): Widgets block. Avatar-led event feed with a connecting rail, actor and action lines, timestamps, quoted bodies and date dividers. Ships composable parts. Markdown: https://hirael.com/r/activity-feed.md. Registry JSON: https://hirael.com/r/activity-feed.json
- [Inspector Panel](https://hirael.com/blocks/widgets/inspector-panel): Widgets block. Design-tool inspector with a header, collapsible sections and label/control rows. Composable parts for property panels and sidebars. Markdown: https://hirael.com/r/inspector-panel.md. Registry JSON: https://hirael.com/r/inspector-panel.json
- [Tenant Switcher](https://hirael.com/blocks/widgets/tenant-switcher): Widgets block. Workspace, organization or project switcher for multi-tenant apps. Logo or initials, plan or role caption, grouped and searchable list, and a create action. Ships composable parts. Markdown: https://hirael.com/r/tenant-switcher.md. Registry JSON: https://hirael.com/r/tenant-switcher.json
- [KPI Grid](https://hirael.com/blocks/widgets/kpi-grid): Widgets block. Hairline-joined grid of KPI tiles with label, value, an up/down/flat delta chip and a sparkline. Ships composable parts. Markdown: https://hirael.com/r/kpi-grid.md. Registry JSON: https://hirael.com/r/kpi-grid.json
- [Quick Actions](https://hirael.com/blocks/widgets/quick-actions): Widgets block. Grid of dashboard shortcut tiles with icon, label and description; each opens a small form and shows its result in place. Each tile is a button or, via asChild, a link. Ships composable parts. Markdown: https://hirael.com/r/quick-actions.md. Registry JSON: https://hirael.com/r/quick-actions.json
- [Notifications](https://hirael.com/blocks/widgets/notifications): Widgets block. Notification panel with an All/Unread filter, mark all read, per-item mark read and dismiss, an empty state, and a primary-colored unread marker. Ships composable parts. Markdown: https://hirael.com/r/notifications.md. Registry JSON: https://hirael.com/r/notifications.json
- [Cookie Consent](https://hirael.com/blocks/widgets/cookie-consent): Widgets block. Floating consent banner with per-category switches, accept, reject, and save actions, and a choice persisted in localStorage. Ships composable parts. Markdown: https://hirael.com/r/cookie-consent.md. Registry JSON: https://hirael.com/r/cookie-consent.json
- [Page Header 01](https://hirael.com/blocks/page-header/page-header-01): Page headers block. Detail page header with a breadcrumb that collapses on small screens, a status badge, owner and contributor meta, and Share, Edit and overflow actions. Share copies the link, Edit renames in place, Archive locks the page until restored and Delete can be undone. Ships composable parts. Markdown: https://hirael.com/r/page-header-01.md. Registry JSON: https://hirael.com/r/page-header-01.json
- [Page Header 02](https://hirael.com/blocks/page-header/page-header-02): Page headers block. Workspace header with a primary action and line tabs for Overview, Members, Billing and Settings, kept in sync with the URL hash. Inviting someone updates the member count and the billing total, and renaming the workspace updates the title. Ships composable parts. Markdown: https://hirael.com/r/page-header-02.md. Registry JSON: https://hirael.com/r/page-header-02.json
- [Page Header 03](https://hirael.com/blocks/page-header/page-header-03): Page headers block. Invoice list header with a live count, a New invoice dialog and a toolbar for search, status filter, sort and list or grid layout. Shows an empty result with Clear filters when nothing matches. Ships composable parts. Markdown: https://hirael.com/r/page-header-03.md. Registry JSON: https://hirael.com/r/page-header-03.json
- [Page Header 04](https://hirael.com/blocks/page-header/page-header-04): Page headers block. Analytics header with a 7, 30 or 90 day range and CSV export, above a strip of four metrics with animated values, sparklines and change chips colored by whether the change is good or bad. Ships composable parts. Markdown: https://hirael.com/r/page-header-04.md. Registry JSON: https://hirael.com/r/page-header-04.json
- [Empty State 01](https://hirael.com/blocks/empty-states/empty-state-01): Empty states block. A first-run projects panel. Create a project with a validated name or import a GitHub repo, and the list replaces the empty state. Markdown: https://hirael.com/r/empty-state-01.md. Registry JSON: https://hirael.com/r/empty-state-01.json
- [Empty State 02](https://hirael.com/blocks/empty-states/empty-state-02): Empty states block. A customer list with search and plan and status filters. When nothing matches, it repeats the query, says how many matches the filters hide, suggests close matches and offers to clear filters. Markdown: https://hirael.com/r/empty-state-02.md. Registry JSON: https://hirael.com/r/empty-state-02.json
- [Empty State 03](https://hirael.com/blocks/empty-states/empty-state-03): Empty states block. A deployments panel that failed to load, with a copyable error reference and a support link. Try again shows loading rows, fails once more, then loads the data. Markdown: https://hirael.com/r/empty-state-03.md. Registry JSON: https://hirael.com/r/empty-state-03.json
- [Empty State 04](https://hirael.com/blocks/empty-states/empty-state-04): Empty states block. A members panel with an invite form inside the empty state. Invites are validated and listed as pending, and revoking the last one brings the empty state back. Markdown: https://hirael.com/r/empty-state-04.md. Registry JSON: https://hirael.com/r/empty-state-04.json
- [Search 01](https://hirael.com/blocks/search/search-01): Search block. Docs search with type, product area and date facets whose counts reflect the other active filters, removable filter chips and relevance or newest sorting. Ships composable parts. Markdown: https://hirael.com/r/search-01.md. Registry JSON: https://hirael.com/r/search-01.json
- [Search 02](https://hirael.com/blocks/search/search-02): Search block. Search field with a suggestion dropdown: recent and popular searches when empty, matching pages and people while typing. Slash focuses it and the arrow keys move through results. Markdown: https://hirael.com/r/search-02.md. Registry JSON: https://hirael.com/r/search-02.json
- [Search 03](https://hirael.com/blocks/search/search-03): Search block. Search results page with type tabs and counts, results laid out for docs, people and files, a spelling correction when nothing matches, and paged loading. Markdown: https://hirael.com/r/search-03.md. Registry JSON: https://hirael.com/r/search-03.json
- [Search 04](https://hirael.com/blocks/search/search-04): Search block. Help center search section with popular topics that fill the query, live matching articles as you type, and a category index when the field is empty. Markdown: https://hirael.com/r/search-04.md. Registry JSON: https://hirael.com/r/search-04.json
- [Survey 01](https://hirael.com/blocks/survey/survey-01): Surveys block. NPS card built on Questionnaire: a 0 to 10 scale with number-key shortcuts, then a required follow-up question that changes with the score. Submitting shows the score with a Change answer action. Ships composable parts. Markdown: https://hirael.com/r/survey-01.md. Registry JSON: https://hirael.com/r/survey-01.json
- [Survey 02](https://hirael.com/blocks/survey/survey-02): Surveys block. Four-question feedback card built on the Questionnaire: single choice, pick up to 3, a 1 to 5 rating and an optional comment you can skip. Required questions validate inline, and a review step lets you edit any answer before submitting. Markdown: https://hirael.com/r/survey-02.md. Registry JSON: https://hirael.com/r/survey-02.json
- [Survey 03](https://hirael.com/blocks/survey/survey-03): Surveys block. Plan card with a cancellation survey in a dialog, built on Questionnaire. The reason you pick decides the follow-up step (a discount, a pause or a feedback question), and the card shows the result with an undo. Markdown: https://hirael.com/r/survey-03.md. Registry JSON: https://hirael.com/r/survey-03.json
- [Survey 04](https://hirael.com/blocks/survey/survey-04): Surveys block. Full-height survey that shows one question per screen, with letter-key answers, Enter to continue and a thin progress bar. One answer skips a later question, and the flow ends on a personal thank-you with a restart. Markdown: https://hirael.com/r/survey-04.md. Registry JSON: https://hirael.com/r/survey-04.json
- [Chart 01](https://hirael.com/blocks/charts/chart-01): Charts block. Monthly revenue bar chart by plan with a year select, a stacked or grouped toggle, totals above the bars and a summary line computed from the data. Markdown: https://hirael.com/r/chart-01.md. Registry JSON: https://hirael.com/r/chart-01.json
- [Chart 02](https://hirael.com/blocks/charts/chart-02): Charts block. Traffic area charts for visitors and signups with a 7, 30 or 90 day range, legend cards that turn each series on or off, and a crosshair tooltip shared across both panels. Markdown: https://hirael.com/r/chart-02.md. Registry JSON: https://hirael.com/r/chart-02.json
- [Chart 03](https://hirael.com/blocks/charts/chart-03): Charts block. Revenue by channel donut with the total in the centre and a ranked list of value, share and change. Hovering a row highlights its slice and hovering a slice highlights its row. Markdown: https://hirael.com/r/chart-03.md. Registry JSON: https://hirael.com/r/chart-03.json
- [Chart 04](https://hirael.com/blocks/charts/chart-04): Charts block. Signup funnel from visited to subscribed, showing the count, share of visitors, step conversion and drop-off at each step, with an All, Organic or Paid segment toggle. Markdown: https://hirael.com/r/chart-04.md. Registry JSON: https://hirael.com/r/chart-04.json
- [Chat 01](https://hirael.com/blocks/chat/chat-01): Chat block. Messenger with a searchable conversation list, unread counts that clear when opened, and a thread that sticks to the newest message, with attachments and an emoji picker in the composer. On phones the list and thread become two screens. Ships composable parts. Markdown: https://hirael.com/r/chat-01.md. Registry JSON: https://hirael.com/r/chat-01.json
- [Chat 02](https://hirael.com/blocks/chat/chat-02): Chat block. Floating support widget with the typical reply time, quick replies, an agent that answers a few topics after a typing indicator, and a rating when the conversation ends. Ships composable parts. Markdown: https://hirael.com/r/chat-02.md. Registry JSON: https://hirael.com/r/chat-02.json
- [Chat 03](https://hirael.com/blocks/chat/chat-03): Chat block. Team channel with emoji reactions, a pinned message, @mentions in the composer, and replies that open in a side thread with its own composer. Ships composable parts. Markdown: https://hirael.com/r/chat-03.md. Registry JSON: https://hirael.com/r/chat-03.json
- [Chat 04](https://hirael.com/blocks/chat/chat-04): Chat block. Shared customer inbox with Open, Snoozed and Closed tabs, an assignee filter, internal notes in the composer, saved replies, and snooze and close actions that move conversations between tabs. Ships composable parts. Markdown: https://hirael.com/r/chat-04.md. Registry JSON: https://hirael.com/r/chat-04.json
- [Changelog 01](https://hirael.com/blocks/changelog/changelog-01): Changelog block. Release notes with a sticky date rail, version badges, New / Improved / Fixed tags, a subscribe button, and a filter that narrows entries. Ships composable parts. Markdown: https://hirael.com/r/changelog-01.md. Registry JSON: https://hirael.com/r/changelog-01.json
- [Changelog 02](https://hirael.com/blocks/changelog/changelog-02): Changelog block. Public roadmap board with Now, Next and Later columns. Every item can be upvoted, the board sorts by votes or by date, and on small screens tabs pick the column. Markdown: https://hirael.com/r/changelog-02.md. Registry JSON: https://hirael.com/r/changelog-02.json

## Templates
- [Creative Studio](https://hirael.com/templates/creative-studio): Full-page template. Dark, cinematic creative-studio landing page: a full-viewport hero with an animated backdrop and pull-up wordmark, a scroll-revealed about section, and a staggered feature-card grid. Framer Motion throughout, with a self-contained warm-cream palette. Markdown: https://hirael.com/r/creative-studio.md. Registry JSON: https://hirael.com/r/creative-studio.json
- [Agency Landing](https://hirael.com/templates/agency-landing): Full-page template. Bright, shader-lit agency landing page: a full-viewport hero with an animated WebGL backdrop and pill navigation, an editorial about section, a featured-work grid of autoplaying video cards, and a dark closing footer with a call to action. Built on the shaders package, with a self-contained light palette. Markdown: https://hirael.com/r/agency-landing.md. Registry JSON: https://hirael.com/r/agency-landing.json
- [Mindloop](https://hirael.com/templates/mindloop): Full-page template. Dark, monochrome newsletter landing page: a full-screen video hero with an inline subscribe form, an answer-engine section, scroll-revealed mission copy, a four-up feature grid and a streaming-video call to action. Framer Motion throughout, with a self-contained pure-black palette and liquid-glass accents. Markdown: https://hirael.com/r/mindloop.md. Registry JSON: https://hirael.com/r/mindloop.json
- [Portfolio](https://hirael.com/templates/portfolio): Full-page template. Dark, single-page personal portfolio: a counter loading screen, an HLS video hero with a floating nav and a cycling role line, a bento work grid, a journal list, a scroll-pinned parallax gallery with lightbox, count-up stats and a video contact footer. Self-contained dark palette, driven by GSAP and Framer Motion. Markdown: https://hirael.com/r/portfolio.md. Registry JSON: https://hirael.com/r/portfolio.json
- [USD Halo](https://hirael.com/templates/usd-halo): Full-page template. Premium fintech landing page for a stablecoin: a full-bleed video hero with a custom halo wordmark and an infinite brand marquee, a meet-the-product card grid, a backers marquee, and a use-modes split with an autoplaying video panel, closing on a dark anchor footer. Self-contained light palette. Markdown: https://hirael.com/r/usd-halo.md. Registry JSON: https://hirael.com/r/usd-halo.json
- [Rivr](https://hirael.com/templates/rivr): Full-page template. DeFi staking landing page for a fluid-asset protocol: a video hero on a rounded card with glass stat cards and a carved documentation corner, a metrics band, a bento feature grid, a video call to action and a light footer. Self-contained light palette, Helvetica system type, Framer Motion throughout. Markdown: https://hirael.com/r/rivr.md. Registry JSON: https://hirael.com/r/rivr.json
- [Velorah](https://hirael.com/templates/velorah): Full-page template. Dark, premium landing page for an electric RV brand: a full-screen video hero with liquid-glass navigation, a centered tagline, a split feature card with switchable tabs, an HLS streaming statement with a stats row, a video preorder call to action and a multi-column footer. Self-contained pure-black palette, Inter + Instrument Serif type. Markdown: https://hirael.com/r/velorah.md. Registry JSON: https://hirael.com/r/velorah.json
- [Asme](https://hirael.com/templates/asme): Full-page template. Dark, liquid-glass marketing landing page: a full-viewport hero with a cross-fading background video, a frosted glass pill nav and an inline email form, then scroll-revealed about, featured-video, philosophy and services sections, closing on a multi-column footer. Framer Motion throughout, with a self-contained pure-black palette and Instrument Serif accents. Markdown: https://hirael.com/r/asme.md. Registry JSON: https://hirael.com/r/asme.json
- [Prism](https://hirael.com/templates/prism): Full-page template. Dark, liquid-glass landing page for an AI web design agency: a fixed glass pill nav, a full-screen video hero whose headline blurs in word by word over a partners row, a video-backed how-it-works statement, alternating feature rows with looping media, a four-card benefits grid, a stats band over a desaturated video, three testimonials and a video call to action that carries the footer. Self-contained pure-black palette, Barlow + Instrument Serif type, CSS entrances only. Markdown: https://hirael.com/r/prism.md. Registry JSON: https://hirael.com/r/prism.json
- [AKOR](https://hirael.com/templates/akor): Full-page template. Dark landing page for an intelligent-security firm: a fixed uppercase navbar, a full-screen video hero with copy anchored bottom-start, an inverted near-white services band with a 2x2 numbered card grid, a black about split with a looping video beside a heading-and-mission column, and a simple footer. Self-contained charcoal palette with a vivid green primary, Sora type, CSS entrances only. Markdown: https://hirael.com/r/akor.md. Registry JSON: https://hirael.com/r/akor.json
- [NexaCore](https://hirael.com/templates/nexacore): Full-page template. Light enterprise-infrastructure landing page: a floating pill navbar that shrinks on scroll, a full-screen video hero, a dark service-card grid that unfolds on hover, a chaos-versus-control split around a circular streaming video, and a four-pillar delivery staircase. Self-contained navy-and-lavender palette with multi-stop brand gradients, driven by lucide-react. Markdown: https://hirael.com/r/nexacore.md. Registry JSON: https://hirael.com/r/nexacore.json
- [Aurael](https://hirael.com/templates/aurael): Full-page template. Bilingual (EN/AR) landing page for a home-solar brand, built around a day/night control that re-themes the whole page: a full-height photographic hero that cross-fades between morning and night, then hairline-ruled bands with a sticky meta rail for how it works, cases, about, careers, resources and customers. Self-contained morning/night palettes, Inter + Manrope with Cairo for Arabic, and RTL that follows the surrounding document. Markdown: https://hirael.com/r/aurael.md. Registry JSON: https://hirael.com/r/aurael.json
- [Novael](https://hirael.com/templates/novael): Full-page template. Bilingual (EN/AR) landing page for a technology services firm: a fixed scroll-spy navbar over a headline that sits on a photographic band, an overlapping intro card and count-up stats, a marquee of past employers, a teal service slab, a project grid whose captions expand on hover, and a contact section that doubles as the footer. Self-contained dark palette, Inter + Manrope with Cairo for Arabic, and RTL that follows the surrounding document. Markdown: https://hirael.com/r/novael.md. Registry JSON: https://hirael.com/r/novael.json

## Hooks & utilities
- [useControllableState](https://hirael.com/utilities/hooks/use-controllable-state): React hook. A value that is controlled through a prop or kept internally, with one setter that updates either and reports the change. The pattern behind value and defaultValue. Markdown: https://hirael.com/r/use-controllable-state.md. Registry JSON: https://hirael.com/r/use-controllable-state.json
- [useReducedMotion](https://hirael.com/utilities/hooks/use-reduced-motion): React hook. Live prefers-reduced-motion match without an animation library. Renders false on the server, so hydration never mismatches, and updates when the setting changes. Markdown: https://hirael.com/r/use-reduced-motion.md. Registry JSON: https://hirael.com/r/use-reduced-motion.json
- [useMediaQuery](https://hirael.com/utilities/hooks/use-media-query): React hook. Live match for any CSS media query, like a breakpoint, dark mode or a touch screen. Renders a fixed value on the server so hydration never mismatches, then follows the real match. Markdown: https://hirael.com/r/use-media-query.md. Registry JSON: https://hirael.com/r/use-media-query.json
- [useDebounce](https://hirael.com/utilities/hooks/use-debounce): React hook. useDebouncedValue holds a value back until it stops changing, for search as you type. useDebouncedCallback returns a stable function with cancel and flush, for autosave. Markdown: https://hirael.com/r/use-debounce.md. Registry JSON: https://hirael.com/r/use-debounce.json
- [useCopyToClipboard](https://hirael.com/utilities/hooks/use-copy-to-clipboard): React hook. Copies text and reports copied for a moment, so a copy button can swap to a check mark. Returns false instead of throwing when the browser refuses. Markdown: https://hirael.com/r/use-copy-to-clipboard.md. Registry JSON: https://hirael.com/r/use-copy-to-clipboard.json
- [composeRefs](https://hirael.com/utilities/utils/compose-refs): Utility. Merges several refs into one callback ref, so a part can keep its own ref and still forward the element. Returns React 19 ref cleanups. Markdown: https://hirael.com/r/compose-refs.md. Registry JSON: https://hirael.com/r/compose-refs.json
- [formatBytes](https://hirael.com/utilities/utils/format-bytes): Utility. Human-readable file sizes in binary steps, such as 1.5 KB or 12.0 MB, for upload lists and storage meters. Markdown: https://hirael.com/r/format-bytes.md. Registry JSON: https://hirael.com/r/format-bytes.json

## Docs
- [Full catalog JSON (Radix UI)](https://hirael.com/r/registry.json): Every item in one shadcn registry document
- [Full catalog JSON (Base UI)](https://hirael.com/r/base/registry.json): The same catalog built on Base UI primitives
- [Components overview](https://hirael.com/components): All components with live previews
- [Blocks overview](https://hirael.com/blocks): Block categories and schematic index
- [Templates overview](https://hirael.com/templates): Full-page templates with framed previews
- [Hooks & utilities overview](https://hirael.com/utilities): Standalone hooks and helpers the components use
- [Changelog](https://hirael.com/changelog): Release notes
- [GitHub](https://github.com/MohammadShehadeh/hirael): Source repository

Component categories: inputs = Inputs, pickers = Pickers, files = Files, data = Data display, display = Display, animation = Animation, navigation = Navigation, ai = AI