Blocks
Bigger components built only from @vhyxui/react primitives. Drop in a pricing table, an auth form, or a searchable data table in one line — every piece stays accessible and agent-readable.
Install
pnpm add @vhyxui/blocks @vhyxui/react @vhyxui/tokensimport '@vhyxui/tokens/index.css';
import '@vhyxui/react/style.css';
import '@vhyxui/blocks/style.css';
import { PricingTable, AuthForm, DataTable } from '@vhyxui/blocks';Links inside blocks default to <a>. Pass linkAs={Link} (Next.js, React Router) for client-side navigation.
App blocks
Overview
Last 30 days
Revenue
Active users
Churn
No invoices yet
Create your first invoice to get paid faster.
Everything at a glance.
Forms
Danger zone
Irreversible actions
Deleting the workspace removes all projects, members and billing history.
Data
| Role | ||
|---|---|---|
| Ada #1 | Admin | 0 |
| Grace #2 | Editor | 7 |
| Alan #3 | Viewer | 14 |
| Linus #4 | Admin | 21 |
| Margaret #5 | Editor | 28 |
1–5 of 23
Marketing
Build UIs humans and AI agents both understand
Accessible components, Tailwind-friendly styling, and machine-readable contracts in one library.
Why VhyxUI
Accessible
Keyboard, focus and screen-reader support are built in and tested with axe.
Your styles
CSS variables, cascade layers and a Tailwind preset — override anything.
Agent-ready
Every component publishes a VhyxSeal contract describing what it does.
Free
For side projects
$0/mo- All components
- Community support
Pro
Most popularFor teams shipping fast
$19/mo- Everything in Free
- All blocks & layouts
- Priority support
Enterprise
Security & compliance
Custom- SSO
- Audit logs
- Dedicated support