Bearnie is a developer-focused tool designed to help you build and maintain a custom component library for your Astro projects. Unlike traditional component libraries that are distributed as rigid npm packages, Bearnie allows you to copy the component source code directly into your project. This approach grants you total ownership and control over your components, enabling you to modify, extend, or delete any part of the code to perfectly suit your requirements without fighting against library opinions or version locks. Built by Michael Andreuzza, Bearnie is crafted specifically for the Astro ecosystem.

Functionality centers on providing a curated set of accessible, highly-customizable components that can be added to an existing Astro and Tailwind CSS project via a CLI tool or MCP server. By placing code directly within your workspace, it ensures that your components are readable, editable, and free from the constraints of black-box abstractions. It uses vanilla JavaScript to provide interactivity while focusing on progressive enhancement, ensuring that features work without unnecessary framework overhead.

Some of the key features are:

• Full Source Control: Every component is copied to your project files, ensuring you own and can customize every line of code without external version locks.
• Astro & Tailwind Native: Built specifically for Astro and Tailwind CSS, providing seamless integration with minimal configuration.
• Accessible Defaults: All components adhere to WCAG 2.1 AA guidelines, including keyboard navigation, screen reader support, and focus management.
• Zero Framework Tax: Components use plain JavaScript for interactivity, avoiding heavy framework runtimes being shipped to the browser.
• CLI Integration: A powerful CLI allows you to initialize your project, add specific components, or list available options with ease.
• MCP Support: Use AI assistants like Claude or Cursor to manage your components via the Model Context Protocol, simplifying addition and discovery.
• Progressive Enhancement: Components are functional without JavaScript, ensuring a robust user experience across all devices.
• Easy Theming: Leverage CSS variables for quick, global changes to colors and themes, including built-in light and dark mode support.

To get started, you can initialize a new project or add Bearnie to an existing one using its CLI tools. Once installed, adding a component is as simple as running a command, which pulls the necessary code and utilities into your local file structure. Because you control the files, updates are manual, allowing you to review changes before integrating them into your specific codebase, keeping your project stable and predictable.

Some common use cases include:

• Rapid Prototyping: Quickly scaffolding landing pages or complex applications using pre-built, accessible UI components.
• Custom Component Design Systems: Creating a private, highly-tuned component library for a startup or enterprise product where third-party package customization becomes a bottleneck.
• Learning & Education: Using the provided code as a learning resource to understand how modern, accessible web components are built with vanilla JS and Tailwind.
• AI-Assisted Development: Letting an AI assistant build out a UI by automatically adding and configuring components from the Bearnie registry via the MCP server.