Introduction

uibrik is a collection of interaction-first React components: buttons that react to a press, text that animates in, charts that count up, and WebGL backgrounds. They're built with Tailwind CSS, Motion and, where it helps, WebGL shaders.

It isn't a package you import. Each component is source code that goes into your project, so you can read it, change it and keep it. Copy it from the component page, or install it with the shadcn CLI.

npx shadcn@latest add https://uibrik.com/r/gauge.json

Next, read Installation to set up your project.

94 components in 4 groups. Every component page has a live preview, the packages it needs and every file.

• Text AnimationsEntrances, Transitions, Interactive27
• ComponentsButtons, Inputs, Navigation, Feedback, Media, Charts, Stats, Effects50
• BlocksFAQ, Pricing6
• BackgroundsBackgrounds11

• Interaction first. Motion explains what happened: a press, a change, a result. Nothing moves just to look busy.
• You own the code. No runtime package to upgrade, no API to work around. Edit the file.
• Your theme, not ours. Components use shadcn's token names (background, foreground, muted, border), so they follow the theme you already have. See Theming.
• Few dependencies. React, Tailwind CSS and Motion cover most components. Anything else is listed on the component page and installed for you by the CLI.

Every component is free today. Pro components are planned for later.