Accessible, modern, open source React component library inspired by USWDS built with Radix UI.
- 🎨 Modern Design: Clean, professional components inspired by USWDS
- ♿ Accessible: Built with accessibility in mind using Radix UI primitives
- 🎯 TypeScript: Full TypeScript support with comprehensive type definitions
- 🎨 Customizable: Easily themeable with CSS custom properties
- 📱 Responsive: Mobile-first design approach
- ⚡ Performance: Optimized for speed and bundle size
Vero supports both React 18 and React 19:
- React 18.2.0+: Full support with all features
- React 19.0.0+: Full support with all features
npm install @capitaltg/vero
# or
yarn add @capitaltg/vero
# or
pnpm add @capitaltg/vero- Install the package and its peer dependencies:
npm install @capitaltg/vero react react-dom tailwindcss tailwindcss-animate- Import the CSS in your main CSS file:
@import '@capitaltg/vero/index.css';- Configure Tailwind CSS by extending your
tailwind.config.js:
import veroConfig from '@capitaltg/vero/tailwind.config.js';
export default {
...veroConfig,
content: [...veroConfig.content, './src/**/*.{js,ts,jsx,tsx}'],
};- Start using components:
import { Button, Input, FormItem } from '@capitaltg/vero';
function App() {
return (
<div>
<FormItem label="Email" hintText="Enter your email address">
<Input type="email" placeholder="[email protected]" />
</FormItem>
<Button variant="primary">Submit</Button>
</div>
);
}Visit our Storybook documentation to explore all available components and their usage examples.
We welcome contributions! Please see our Contributing Guide for details.
MIT © Capital Technology Group