Frequently Asked Questions

The BtP Component Library is a collection of reusable, accessible, and customizable UI components built for modern web standards. It provides production-ready primitives that respect every user, viewport, and preference.

Yes. The library is open source and available on GitHub. You can use it in personal and commercial projects. Check the repository for full license details.

The library targets all modern evergreen browsers including Chrome, Firefox, Safari, and Edge. Components use progressive enhancement and respect user preferences like reduced motion and color scheme.

Download the latest release from GitHub, then include the base CSS and any component CSS/JS files you need. The library is dependency-free and works with any build tool or as plain script/link tags.

No. The components work as plain HTML, CSS, and vanilla JavaScript. You can include them directly in any project. However, if you use a bundler like Vite or Webpack, the ES module imports will work seamlessly.

Yes. Each component is self-contained with its own CSS and JS files. All components extend from a shared base component class that ships with each one, so there are no extra cross-component dependencies to manage.

The library uses CSS custom properties for all colors, sizes, and durations. Override the variables on the :root or html selector to theme the entire library, or scope overrides to individual components.

Yes. Typography is controlled through CSS custom properties for font family, size scale, weight, and line height. Swap the font files and update the variables to match your brand.

Yes. The library fully supports dark mode out of the box. All color tokens include automatic dark mode swaps, so components adapt without any extra configuration.

Accessibility is a core design principle and we strive to be WCAG compliant. Components use semantic HTML, proper ARIA attributes, keyboard navigation, and focus management, and are tested with axe-core. That said, we recommend testing within your own context to ensure full compliance.

Yes. All animated components check prefers-reduced-motion and adjust or disable animations accordingly. The hero canvas animation pauses entirely, and CSS transitions are reduced to near-instant.