Introduction

tealmac UI is a library of React components for the web, built with Tailwind CSS 4 and Motion. It covers the everyday primitives, text effects, buttons, cards, backgrounds, device mockups, charts, AI interfaces and complete page blocks. Everything installs through the shadcn/ui CLI and works in any React app, whatever platform it ships to.

How it works

The library is a registry, not a package. When you add a component, the CLI copies its source into your project. From then on it is your code: change the markup, swap the animation, delete what you don't need. Read how it works for the details.

What every component gives you

• Readable source. One file per component where possible, typed props and no hidden runtime.
• Motion that listens. Animations calm down or stop when someone asks their system to reduce motion.
• Keyboard and screen reader paths. Interactive parts are real buttons, links and inputs with visible focus. Decorative effects are hidden from assistive technology.
• Light and dark themes. Colors come from the standard shadcn/ui CSS variables, so components follow your theme.

Get started

• Install your first component in a React and Tailwind project.
• Make it yours with a theme or a complete preset.
• Connect your coding agent so it can find and install components for you.
• Browse every component by category.

License

The components are free under the MIT license. Pro adds premium blocks, templates and patterns under the Pro licence. The library builds on shadcn/ui and Magic UI, both MIT-licensed. Their notices are kept in THIRD_PARTY_NOTICES.md in the repository.