---
name: "@ssych"
slug: "ssych"
description: "Dark, data-dense React components for high-stakes decision surfaces: trading books, screeners, clinical dashboards. Hand-drawn SVG charts, no chart runtime."
category: "AI/chat UI"
tags: ["ai", "buttons", "cards", "charts", "crypto", "dashboard", "forms", "glassmorphism", "hooks", "maps", "marketing", "media", "navigation", "onboarding", "overlays", "payments", "pro-available", "tables"]
framework: "react"
license: null
author: null
website: "https://ui.ssych.com"
github: null
registry: "https://ui.ssych.com/r/registry.json"
pro: true
pro_url: "https://ui.ssych.com/library/pricing"
github_stars: null
component_count: 134
generated_at: "2026-10-27T06:34:08.542Z"
---

# @ssych

Dark, data-dense React components for high-stakes decision surfaces: trading books, screeners, clinical dashboards. Hand-drawn SVG charts, no chart runtime.

## Links

- Website: https://ui.ssych.com
- Registry JSON: https://ui.ssych.com/r/registry.json
- Directory page: https://sh4dcn.netlify.app/registry/ssych
- This file: https://sh4dcn.netlify.app/md/ssych.md
- Pro / pricing: https://ui.ssych.com/library/pricing

## Install

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

## Components (134)

| name | type | description | install |
| --- | --- | --- | --- |
| file-tree | registry:ui | A file tree for code bundles, data exports and research folders, with folding folders, keyboard navigation and sizes on the right. | `npx shadcn@latest add https://ui.ssych.com/r/file-tree.json` |
| sidebar | registry:ui | A collapsible sidebar navigation for SaaS admin panels and trading dashboards, with accordion sections, an active rail and a mobile drawer. | `npx shadcn@latest add https://ui.ssych.com/r/sidebar.json` |
| macos-dock | registry:ui | A macOS style app dock with magnifying icons and a ⌘K command menu, for launchers and workspace switchers in trading and AI tools. | `npx shadcn@latest add https://ui.ssych.com/r/macos-dock.json` |
| browser-window | registry:ui | A browser window mockup for showing a dashboard or web app on a landing page, in Chrome or Safari frames, with a phone layout under 480px. | `npx shadcn@latest add https://ui.ssych.com/r/browser-window.json` |
| macbook-frame | registry:ui | A MacBook mockup frame for product screenshots and live app embeds on landing pages, pitch decks and fintech case studies. | `npx shadcn@latest add https://ui.ssych.com/r/macbook-frame.json` |
| card-stack | registry:ui | A swipeable card stack carousel for product showcases and feature tours; drag the top card away or click it to open a detail modal. | `npx shadcn@latest add https://ui.ssych.com/r/card-stack.json` |
| card-grid | registry:ui | A responsive card grid for products, strategies or case studies, with hover actions on each card and a shared detail modal. | `npx shadcn@latest add https://ui.ssych.com/r/card-grid.json` |
| card-list | registry:ui | A vertical card list for reports, products or case studies, each card with media and copy, opening into a shared detail modal. | `npx shadcn@latest add https://ui.ssych.com/r/card-list.json` |
| bento-gallery | registry:ui | A draggable bento grid gallery for product shots and dashboard screenshots that opens into a shared lightbox. | `npx shadcn@latest add https://ui.ssych.com/r/bento-gallery.json` |
| cutout-card | registry:ui | Media card with a scooped-out content tray (concave corners), hover-reveal action button, and gradient overlay. | `npx shadcn@latest add https://ui.ssych.com/r/cutout-card.json` |
| accordion | registry:ui | An accordion for feature and FAQ sections on product pages, each row opening to a body, a checklist and a screenshot. | `npx shadcn@latest add https://ui.ssych.com/r/accordion.json` |
| project-card | registry:ui | Shared cutout project card with blurred-gradient media and a liquid-metal hover ring. | `npx shadcn@latest add https://ui.ssych.com/r/project-card.json` |
| historical-eps | registry:ui | A quarterly EPS chart for stock research and earnings screens, with forecast against reported bars and the surprise on hover. | `npx shadcn@latest add https://ui.ssych.com/r/historical-eps.json` |
| price-target-fan | registry:ui | An analyst price target chart for stock research: a year of price history, then projections fanning out to the high, mean and low targets. | `npx shadcn@latest add https://ui.ssych.com/r/price-target-fan.json` |
| market-watchlist | registry:ui | A watchlist that reads as one chart: every watched coin as a line from the same open, a row per coin, and the whole market beside it in tokens, sectors and yie… | `npx shadcn@latest add https://ui.ssych.com/r/market-watchlist.json` |
| sma-chart | registry:ui | A stock price chart with 20 and 50 day simple moving average overlays and crosshair scrubbing, for trading and technical analysis screens. | `npx shadcn@latest add https://ui.ssych.com/r/sma-chart.json` |
| dotted-area-chart | registry:ui | A crypto price area chart on a dotted field; scrub it to light the stretch you have passed and read the price and move at any point. | `npx shadcn@latest add https://ui.ssych.com/r/dotted-area-chart.json` |
| health-gauge | registry:ui | A gauge chart for margin ratio, fear and greed or liquidity scores, on a 270 degree dial that counts up and cycles metrics on click. | `npx shadcn@latest add https://ui.ssych.com/r/health-gauge.json` |
| market-heatmap | registry:ui | A stock market heatmap with tiles sized by market cap and tinted by the daily move, for market overview and trading dashboards. | `npx shadcn@latest add https://ui.ssych.com/r/market-heatmap.json` |
| sankey-flow | registry:ui | A Sankey diagram for cash flow, budgets and fund flows, where income pools in one hub and each ribbon width stands for the amount. | `npx shadcn@latest add https://ui.ssych.com/r/sankey-flow.json` |
| donut-chart | registry:ui | A crypto portfolio donut chart that shows allocation as a ring with the total in the centre, the ring and its legend highlighting together. | `npx shadcn@latest add https://ui.ssych.com/r/donut-chart.json` |
| balance-header | registry:ui | A wallet and bank balance header with the total, the 24h move and a privacy toggle that masks every figure, for crypto and fintech apps. | `npx shadcn@latest add https://ui.ssych.com/r/balance-header.json` |
| market-snapshot | registry:ui | A stock price card with periods from 1D to All and a line chart you scrub for the price at any moment, for broker and market apps. | `npx shadcn@latest add https://ui.ssych.com/r/market-snapshot.json` |
| index-card | registry:ui | A market index card for the S&P 500, Dow, Nasdaq and Russell, with tabs between indices and an intraday line you can scrub. | `npx shadcn@latest add https://ui.ssych.com/r/index-card.json` |
| range-navigator | registry:ui | A price history chart with a range selector minimap; drag the window to pan and pull an edge to zoom, for trading and analytics apps. | `npx shadcn@latest add https://ui.ssych.com/r/range-navigator.json` |
| sectors-donut | registry:ui | A sector allocation donut for ETF and fund pages that shows each sector weight and dims the rest while you hover one. | `npx shadcn@latest add https://ui.ssych.com/r/sectors-donut.json` |
| ratings-radar | registry:ui | An analyst ratings chart for stock research pages, spreading strong buy to strong sell on a pentagon pulled toward the consensus. | `npx shadcn@latest add https://ui.ssych.com/r/ratings-radar.json` |
| analyst-radar | registry:ui | A factor score radar chart for equity research, comparing a company with its sector on value, growth, profit, momentum and quality. | `npx shadcn@latest add https://ui.ssych.com/r/analyst-radar.json` |
| kpi-card-row | registry:ui | A KPI card row for SaaS, AI and API dashboards, with metrics like requests and uptime counting up over area charts you can scrub. | `npx shadcn@latest add https://ui.ssych.com/r/kpi-card-row.json` |
| heat-calendar | registry:ui | A calendar heatmap of daily activity such as transactions, trades or API calls, with a readout on hover and a selected span that totals the days. | `npx shadcn@latest add https://ui.ssych.com/r/heat-calendar.json` |
| returns-calendar | registry:ui | A monthly returns heatmap for funds, strategies and backtests, with a compounded yearly column and spans you select to compound returns. | `npx shadcn@latest add https://ui.ssych.com/r/returns-calendar.json` |
| holdings-table | registry:ui | A fund holdings table with market value, price, YTD return and portfolio weight bars, sortable by any column, for ETF and wealth apps. | `npx shadcn@latest add https://ui.ssych.com/r/holdings-table.json` |
| trade-journal-table | registry:ui | A trade journal table for crypto and stock traders, with the open position lit and every closed trade settled to a win or loss. | `npx shadcn@latest add https://ui.ssych.com/r/trade-journal-table.json` |
| fills-blotter | registry:ui | A live order fills blotter for brokers and trading desks, streaming executions that land as working and resolve to filled or rejected. | `npx shadcn@latest add https://ui.ssych.com/r/fills-blotter.json` |
| candlestick | registry:ui | A candlestick chart with a volume histogram, a magnet crosshair and a live OHLC legend, for stock and crypto trading terminals. | `npx shadcn@latest add https://ui.ssych.com/r/candlestick.json` |
| equity-drawdown | registry:ui | An equity curve with a synced drawdown chart for backtests and trading performance, one crosshair reading return, drawdown and days below peak. | `npx shadcn@latest add https://ui.ssych.com/r/equity-drawdown.json` |
| balance-chart | registry:ui | A wallet balance chart for crypto and banking apps: an area line coloured by trend, with high and low marks and timeframes from 1H to All. | `npx shadcn@latest add https://ui.ssych.com/r/balance-chart.json` |
| price-scrubber | registry:ui | A stock price chart you scrub with a magnet crosshair and price and time badges on the axes, the headline price turning green or red against the open. | `npx shadcn@latest add https://ui.ssych.com/r/price-scrubber.json` |
| comb-rows | registry:ui | A peer comparison chart that draws each company as a ruler of ticks, for valuation metrics like P/E across a sector. | `npx shadcn@latest add https://ui.ssych.com/r/comb-rows.json` |
| ticker-tape | registry:ui | A scrolling stock and crypto ticker tape with BTC, ETH, TAO and NVDA, green up and red down, paused on hover, for headers and trading dashboards. | `npx shadcn@latest add https://ui.ssych.com/r/ticker-tape.json` |
| trade-tape | registry:ui | A live time and sales tape for trading terminals, streaming prints coloured by side and sized by volume, with block trades highlighted. | `npx shadcn@latest add https://ui.ssych.com/r/trade-tape.json` |
| simple-chart | registry:ui | A compact crypto price card with one line and one number that follows your pointer, for wallets, exchanges and market widgets. | `npx shadcn@latest add https://ui.ssych.com/r/simple-chart.json` |
| matrix-ticker-board | registry:ui | A dot matrix stock price board drawn on canvas, where changed digits dissolve and redraw on each quote, for trading floors and landing pages. | `npx shadcn@latest add https://ui.ssych.com/r/matrix-ticker-board.json` |
| request-log | registry:ui | An API request log for developer dashboards, with method, path, status and latency per call and the response body unfolding inline. | `npx shadcn@latest add https://ui.ssych.com/r/request-log.json` |
| new-items-pill | registry:ui | A live trade feed that holds your place while new rows arrive and counts them into a pill, for tapes, alerts and activity feeds. | `npx shadcn@latest add https://ui.ssych.com/r/new-items-pill.json` |
| inbox | registry:ui | A notification inbox for SaaS and trading apps, with unread markers that clear as you read and a mark all as read action. | `npx shadcn@latest add https://ui.ssych.com/r/inbox.json` |
| project-index | registry:ui | A list of companies or projects where each row shows its cover beside the cursor on hover, for fund portfolios and case study pages. | `npx shadcn@latest add https://ui.ssych.com/r/project-index.json` |
| news-card | registry:ui | A market news card that cycles headlines with their source and time, for trading dashboards, broker apps and crypto portals. | `npx shadcn@latest add https://ui.ssych.com/r/news-card.json` |
| alert-stack | registry:ui | A stacked notification panel for price alerts, margin warnings and order fills that fans open on hover and settles as you dismiss. | `npx shadcn@latest add https://ui.ssych.com/r/alert-stack.json` |
| assets-balance-card | registry:ui | A portfolio balance card with rolling odometer digits and an intraday chart you can drag taller, for crypto wallets and banking apps. | `npx shadcn@latest add https://ui.ssych.com/r/assets-balance-card.json` |
| onboarding-checklist | registry:ui | An onboarding checklist for developer and fintech products, with steps that check off and a progress bar counting what is done. | `npx shadcn@latest add https://ui.ssych.com/r/onboarding-checklist.json` |
| preferences-card | registry:ui | An account settings card with rows for profile, payment method and notifications, for SaaS, banking and exchange account pages. | `npx shadcn@latest add https://ui.ssych.com/r/preferences-card.json` |
| empty-state | registry:ui | An empty state for trading and fintech dashboards: a quiet dotted field with one line of copy and one call to action. | `npx shadcn@latest add https://ui.ssych.com/r/empty-state.json` |
| swap-ticket | registry:ui | A token swap widget for DEX and crypto wallet apps, with an editable amount, a flip button, a token picker and slippage settings. | `npx shadcn@latest add https://ui.ssych.com/r/swap-ticket.json` |
| segmented-control | registry:ui | A segmented control for timeframes and view modes like 24h, 7d and 30d, with a thumb that slides between the options. | `npx shadcn@latest add https://ui.ssych.com/r/segmented-control.json` |
| avatar-stack | registry:ui | An overlapping avatar stack for teams, signers or token holders that lifts and names one on hover and lists the overflow. | `npx shadcn@latest add https://ui.ssych.com/r/avatar-stack.json` |
| amount | registry:ui | Currency and crypto amount formatters that keep symbols, decimals, abbreviations and signed colours consistent across a fintech screen. | `npx shadcn@latest add https://ui.ssych.com/r/amount.json` |
| crypto-fiat | registry:ui | A crypto amount input that switches between fiat and token units at the current rate, for wallets, exchanges and payment flows. | `npx shadcn@latest add https://ui.ssych.com/r/crypto-fiat.json` |
| screen-shuffle | registry:ui | A stack of product screenshots that rotates the front screen to the back, for SaaS and fintech landing page heroes. | `npx shadcn@latest add https://ui.ssych.com/r/screen-shuffle.json` |
| mouse-trail-cta | registry:ui | A call to action button whose glow is fed by a cursor particle trail, for the landing page hero of an AI or fintech product. | `npx shadcn@latest add https://ui.ssych.com/r/mouse-trail-cta.json` |
| ascii-turntable | registry:ui | A 3D logo or token mark drawn in ASCII characters that turns with the cursor, for crypto, AI and developer tool landing pages. | `npx shadcn@latest add https://ui.ssych.com/r/ascii-turntable.json` |
| metal-badge | registry:ui | Any SVG mark as a domed chrome badge, drawn in WebGPU. It leans toward the cursor with the light following, and a click flips it. Falls back to a flat chrome f… | `npx shadcn@latest add https://ui.ssych.com/r/metal-badge.json` |
| stone-badge | registry:ui | Any SVG mark as a carved stone badge, drawn in WebGPU: facets, fissures and mineral speckle on a roughened dome. It leans toward the cursor with the key light … | `npx shadcn@latest add https://ui.ssych.com/r/stone-badge.json` |
| gold-badge | registry:ui | The metal badge in gold: any SVG mark as a domed, brushed gold badge drawn in WebGPU. It leans toward the cursor with the light following, and a click flips it. | `npx shadcn@latest add https://ui.ssych.com/r/gold-badge.json` |
| holo-badge | registry:ui | Any SVG mark as a holographic badge: a silver dome under a thin film whose colour shifts with the angle, with a fine sparkle. Drawn in WebGPU, it leans toward … | `npx shadcn@latest add https://ui.ssych.com/r/holo-badge.json` |
| glass-badge | registry:ui | Any SVG mark as a frosted glass badge: translucent, with the light catching its rolled edge and the page showing through. Drawn in WebGPU, it leans toward the … | `npx shadcn@latest add https://ui.ssych.com/r/glass-badge.json` |
| neon-badge | registry:ui | Any SVG mark as a dark badge with a neon outline that glows and breathes. Drawn in WebGPU, it leans toward the cursor and flips on click. | `npx shadcn@latest add https://ui.ssych.com/r/neon-badge.json` |
| lightning-badge | registry:ui | Any SVG mark as a dark glass badge with lightning crawling over its face. Drawn in WebGPU, it leans toward the cursor and flips on click. | `npx shadcn@latest add https://ui.ssych.com/r/lightning-badge.json` |
| ascii-badge | registry:ui | Any SVG mark as a domed badge drawn in characters: the lit surface is read per cell and each cell's brightness picks a character from the ramp, so the letters … | `npx shadcn@latest add https://ui.ssych.com/r/ascii-badge.json` |
| account-dropdown | registry:ui | A crypto wallet account switcher that lists each address with its balance and share of the total, for multi wallet web3 apps. | `npx shadcn@latest add https://ui.ssych.com/r/account-dropdown.json` |
| depth-chart | registry:ui | A market depth chart for crypto exchanges showing bid and ask liquidity around the mid price, with a readout of size on each side. | `npx shadcn@latest add https://ui.ssych.com/r/depth-chart.json` |
| gantt-mini | registry:ui | A compact Gantt chart for sprint and release planning, with a today line and the dates, length and owner of each task on hover. | `npx shadcn@latest add https://ui.ssych.com/r/gantt-mini.json` |
| leverage-ticket | registry:ui | A perpetual futures order ticket with margin, long or short and a leverage slider that updates position size, fees and the liquidation price. | `npx shadcn@latest add https://ui.ssych.com/r/leverage-ticket.json` |
| order-book | registry:ui | A crypto exchange order book with bids, asks and depth bars, reading the cumulative size and value up to any price level. | `npx shadcn@latest add https://ui.ssych.com/r/order-book.json` |
| quick-ticket | registry:ui | A watchlist row that expands into a quick order ticket for market and limit orders, for broker and stock trading apps. | `npx shadcn@latest add https://ui.ssych.com/r/quick-ticket.json` |
| setup-stepper | registry:ui | A setup stepper for onboarding flows like domain verification or API setup, with numbered steps down a rail and a Continue action. | `npx shadcn@latest add https://ui.ssych.com/r/setup-stepper.json` |
| tool-call-card | registry:ui | An AI agent tool call card that shows the arguments, result, duration and status of one call, with a run again action. | `npx shadcn@latest add https://ui.ssych.com/r/tool-call-card.json` |
| vitals-strip | registry:ui | A key stats strip for a stock page with price, market cap, index weight, volume and P/E, each figure showing its formula on hover. | `npx shadcn@latest add https://ui.ssych.com/r/vitals-strip.json` |
| agent-run-timeline | registry:ui | An AI agent run timeline that shows each step with its tool call, duration and status, with the input and output one click away. | `npx shadcn@latest add https://ui.ssych.com/r/agent-run-timeline.json` |
| automation-builder | registry:ui | A trading automation builder that writes a strategy as sentences, from news sentiment to orders, with editable values and a test run. | `npx shadcn@latest add https://ui.ssych.com/r/automation-builder.json` |
| dialog-stack | registry:ui | Stacked dialogs for multi step confirmations like plan changes, approvals and sign off, where each step layers on top and Escape steps back. | `npx shadcn@latest add https://ui.ssych.com/r/dialog-stack.json` |
| graph-comparison | registry:ui | A stock comparison chart that indexes up to four tickers to the same start, for relative performance from 1M to 1Y. | `npx shadcn@latest add https://ui.ssych.com/r/graph-comparison.json` |
| market-shelf | registry:ui | A row of crypto market tiles with price, daily change and a 7 day sparkline, for exchange and portfolio home screens. | `npx shadcn@latest add https://ui.ssych.com/r/market-shelf.json` |
| order-ticket | registry:ui | A buy and sell order form for limit and market orders where price, amount and total stay in sync, for crypto exchanges and broker apps. | `npx shadcn@latest add https://ui.ssych.com/r/order-ticket.json` |
| radial-gauge | registry:ui | A radial gauge for pass rates like model evals, health checks or compliance tests, with fail, watch and pass bands you can read. | `npx shadcn@latest add https://ui.ssych.com/r/radial-gauge.json` |
| stacked-bars | registry:ui | A stacked bar chart of monthly totals by series, shown with AI inference spend by model, reading value and share on hover. | `npx shadcn@latest add https://ui.ssych.com/r/stacked-bars.json` |
| top-coins | registry:ui | A top cryptocurrencies widget with Bitcoin, Ethereum and Solana prices and sparklines over 3M to 1Y, scrubbable for any week. | `npx shadcn@latest add https://ui.ssych.com/r/top-coins.json` |
| volume-profile | registry:ui | A volume profile chart of traded volume by price with the point of control and value area, for futures and crypto traders. | `npx shadcn@latest add https://ui.ssych.com/r/volume-profile.json` |
| allocation-treemap | registry:ui | A portfolio allocation treemap with holdings sized by weight, reading the share and value of each position on hover. | `npx shadcn@latest add https://ui.ssych.com/r/allocation-treemap.json` |
| event-feed | registry:ui | A market events feed grouped by day, each headline with its ticker, price and move, for stock research and trading dashboards. | `npx shadcn@latest add https://ui.ssych.com/r/event-feed.json` |
| info-card | registry:ui | A small callout card with a title, one line and an action row, for help prompts and upsells in a dashboard sidebar. | `npx shadcn@latest add https://ui.ssych.com/r/info-card.json` |
| modal | registry:ui | An accessible modal dialog for confirmations like cancelling orders or revoking API keys, with a focus trap and Escape to close. | `npx shadcn@latest add https://ui.ssych.com/r/modal.json` |
| payment-card | registry:ui | A saved payment card for billing and banking settings that lifts out of its pocket to show the card face, with an update card form. | `npx shadcn@latest add https://ui.ssych.com/r/payment-card.json` |
| release-feed | registry:ui | A changelog feed for developer tools and APIs that groups release notes by added, changed and fixed, with copyable versions. | `npx shadcn@latest add https://ui.ssych.com/r/release-feed.json` |
| stat-tile | registry:ui | Compact stat tiles for trading metrics like net P&L, win rate and Sharpe ratio, each with a sparkline you scrub for any point. | `npx shadcn@latest add https://ui.ssych.com/r/stat-tile.json` |
| total-balance | registry:ui | A total balance chart for crypto and banking accounts with windows from 24h to All, reading balance, change and drawdown at any point. | `npx shadcn@latest add https://ui.ssych.com/r/total-balance.json` |
| wallet-drawer | registry:ui | A crypto wallet drawer with holdings, DeFi positions and activity, plus send, receive and settings views, for web3 apps. | `npx shadcn@latest add https://ui.ssych.com/r/wallet-drawer.json` |
| amount-slider | registry:ui | An amount slider for choosing a share of a balance with 25, 50, 75 and 100 percent presets, for trade, withdraw and stake forms. | `npx shadcn@latest add https://ui.ssych.com/r/amount-slider.json` |
| cross-chain-swap | registry:ui | A cross chain bridge and swap widget for moving tokens between networks like Ethereum, Solana and Arbitrum, reversible in one click. | `npx shadcn@latest add https://ui.ssych.com/r/cross-chain-swap.json` |
| execution-controls | registry:ui | A hold to confirm order button for trading apps that shows the order as working, filled or rejected, with a timed undo. | `npx shadcn@latest add https://ui.ssych.com/r/execution-controls.json` |
| inline-slider | registry:ui | A range filter slider with its label and value inside the track, for screeners and GPU marketplaces filtering memory, cores and price. | `npx shadcn@latest add https://ui.ssych.com/r/inline-slider.json` |
| model-comparison | registry:ui | An LLM comparison table of quality, latency, cost per million tokens and context window, showing each gap to the best model. | `npx shadcn@latest add https://ui.ssych.com/r/model-comparison.json` |
| performance-chart | registry:ui | A portfolio performance chart against a benchmark index, shaded green while ahead and red while behind, with the gap on any day. | `npx shadcn@latest add https://ui.ssych.com/r/performance-chart.json` |
| scatter-plot | registry:ui | A risk and return scatter plot of stocks by volatility and yearly return, naming each point with a hairline to both axes. | `npx shadcn@latest add https://ui.ssych.com/r/scatter-plot.json` |
| swap-confirm | registry:ui | A stock swap confirmation that sells one holding for another, showing the rate and the minimum received before you confirm. | `npx shadcn@latest add https://ui.ssych.com/r/swap-confirm.json` |
| uptime-bars | registry:ui | A 90 day uptime status chart for APIs and inference services, reading the uptime and incident of any day on hover. | `npx shadcn@latest add https://ui.ssych.com/r/uptime-bars.json` |
| watchlist-stack | registry:ui | A stock watchlist with an intraday sparkline, price and daily move per ticker, scrubbable for the price at any moment. | `npx shadcn@latest add https://ui.ssych.com/r/watchlist-stack.json` |
| approval-quorum | registry:ui | A multisig approval widget for treasury and payment releases, where risk, treasury and compliance sign off until the quorum is met. | `npx shadcn@latest add https://ui.ssych.com/r/approval-quorum.json` |
| date-range-picker | registry:ui | A date range picker with two month calendars and presets like last 7, 30 and 90 days, for analytics, reporting and trade history filters. | `npx shadcn@latest add https://ui.ssych.com/r/date-range-picker.json` |
| flow-bars | registry:ui | A net flow bar chart for daily ETF, exchange or wallet inflows and outflows, where dragging across days sums the run. | `npx shadcn@latest add https://ui.ssych.com/r/flow-bars.json` |
| kanban-board | registry:ui | A kanban board for engineering, ops and compliance work with three columns and counts, moving a card forward in one click. | `npx shadcn@latest add https://ui.ssych.com/r/kanban-board.json` |
| morph-disclosure | registry:ui | An expandable row that opens in place into a short sheet of summary and key facts, for product, strategy or company listings. | `npx shadcn@latest add https://ui.ssych.com/r/morph-disclosure.json` |
| positions-table | registry:ui | An open positions table for futures and margin trading with entry, mark, liquidation price and unrealised P&L, plus hold to close. | `npx shadcn@latest add https://ui.ssych.com/r/positions-table.json` |
| series-spotlight | registry:ui | A multi line chart of twelve crypto assets with one highlighted at a time, for comparing coins without losing the one you track. | `npx shadcn@latest add https://ui.ssych.com/r/series-spotlight.json` |
| tape-flow | registry:ui | An order flow chart of the last 48 trades as bars sized by volume and coloured by side, for crypto and futures trading terminals. | `npx shadcn@latest add https://ui.ssych.com/r/tape-flow.json` |
| view-switch | registry:ui | A view switcher for desktop, mobile and code previews where only the selected option shows its label, for docs and component galleries. | `npx shadcn@latest add https://ui.ssych.com/r/view-switch.json` |
| portfolio-book | registry:block | The balance-first book on one ruled grid: holdings, history and share-of-total composed from six library components, with the page composing and never editing … | `npx shadcn@latest add https://ui.ssych.com/r/portfolio-book.json` |
| portfolio-allocation | registry:block | Composition first. Leads with what the book is made of and how concentrated it is, which is the analyst's first question rather than the owner's. | `npx shadcn@latest add https://ui.ssych.com/r/portfolio-allocation.json` |
| portfolio-tiers | registry:block | The book as four accounts rather than one balance. One pill per tier under the bar, and the pill row is a selector rather than decoration, carrying share-of-to… | `npx shadcn@latest add https://ui.ssych.com/r/portfolio-tiers.json` |
| discover-board | registry:block | The browsing problem, not the reporting one: filters and a trending rail for finding something you do not already hold. | `npx shadcn@latest add https://ui.ssych.com/r/discover-board.json` |
| discover-screener | registry:block | The screener take on discovery: a dense sortable board where the row is the unit and the filters carry the state. | `npx shadcn@latest add https://ui.ssych.com/r/discover-screener.json` |
| terminal-cex | registry:block | An exchange terminal on one ruled workspace: candle chart under an interval bar, book or tape as tabs, ticket and account on the right, and a full-width positi… | `npx shadcn@latest add https://ui.ssych.com/r/terminal-cex.json` |
| gpu-pods | registry:block | A GPU rental marketplace's browse screen: 150 pods in a 15-column table you can sort, search and cross-read, with a filter rail whose counts are honest and a p… | `npx shadcn@latest add https://ui.ssych.com/r/gpu-pods.json` |
| wallet-home | registry:block | A self-custody wallet's home and coin pages in one screen: balance, four actions, every coin by share, and a coin's own chart, position and activity one click … | `npx shadcn@latest add https://ui.ssych.com/r/wallet-home.json` |
| business-balances | registry:block | A business account's cash across five currencies: one total in any display currency, scheduled money in and out, idle cash moved into yield, and transfers, con… | `npx shadcn@latest add https://ui.ssych.com/r/business-balances.json` |
| payout-balance | registry:block | A seller's balance and its ledger: available, reserved and treasury money as one split, and every payment, refund and payout in a filterable, reorderable table… | `npx shadcn@latest add https://ui.ssych.com/r/payout-balance.json` |
| money-account | registry:block | A personal account across four currencies: the total, the month's money in and out, a balance per currency with its own account details, and send, add money an… | `npx shadcn@latest add https://ui.ssych.com/r/money-account.json` |
| wealth-invest | registry:block | A household's investments against the market: portfolio growth drawn against four benchmarks, every holding in one sortable table, and an assistant whose answe… | `npx shadcn@latest add https://ui.ssych.com/r/wealth-invest.json` |
| market-watchlist | registry:block | A watchlist that reads as one chart: every watched coin as a line from the same open, a row per coin, and the whole market beside it in tokens, sectors and yie… | `npx shadcn@latest add https://ui.ssych.com/r/market-watchlist.json` |
| asset-alerts | registry:block | One asset's page with its price alerts: the day's line green above the open and red below it, the position, a swap card, and an alerts panel to search, sort, s… | `npx shadcn@latest add https://ui.ssych.com/r/asset-alerts.json` |
| ascii-scroll-morph | registry:block | An immersive landing page with live 3D ASCII shapes that respond to the cursor and transition as you scroll. Adapt the vector artwork, copy and colours in code… | `npx shadcn@latest add https://ui.ssych.com/r/ascii-scroll-morph.json` |
| tradeboard-landing | registry:block | A product landing built on one rule: one ground, one subject, one accent. Giant display headline, the product UI as the hero image, then metric cards, a bento … | `npx shadcn@latest add https://ui.ssych.com/r/tradeboard-landing.json` |
| stablecoin-landing | registry:block | A token landing on the same structure: hero with a brand marquee, a three-card product explainer, a backers marquee and a use-modes grid. Everything structural… | `npx shadcn@latest add https://ui.ssych.com/r/stablecoin-landing.json` |
| simple-landing | registry:block | The library's own marketing page: a near-black ground, one object per section, two-tone display type carrying the hierarchy, and every count read live from the… | `npx shadcn@latest add https://ui.ssych.com/r/simple-landing.json` |

## For AI agents

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