Introduction

An open-source UI component library for building high-quality, accessible design systems and web apps using Vue.

FishtVue

Presenting FishtVue, a modern UI component library designed for Vue.js projects, focusing on accessibility, customization, and developer experience.

FishtVue aims to provide a low-level UI component library that can serve as the foundation of your design system or be adopted incrementally.

Accessibility is at the heart of FishtVue. Our components align with WAI-ARIA design patterns to ensure that all users, regardless of abilities, can interact with your UI effectively. We handle intricate accessibility details like aria attributes, keyboard navigation, and focus management to simplify the developer's work.

Customizable & Unstyled

FishtVue components are designed to be easily customizable, allowing developers to apply their own styles using any preferred CSS method, whether it's vanilla CSS, preprocessors, or CSS-in-JS libraries. Our open component architecture enables you to wrap, extend, or modify each component to fit your needs. For more details, check out our styling guide.

Open & Modular Design

Our components are designed to be open and adaptable, allowing you to customize each element to fit your needs. Whether adding event listeners, props, or refs, FishtVue provides granular access to each component's inner workings.

Flexible State Management

FishtVue components are, by default, uncontrolled but can also be fully controlled when needed. This approach allows developers to decide on the level of state management required, offering a balance between flexibility and ease of use.

Developer-Centric Experience

We prioritize developer experience by maintaining a consistent and predictable API. FishtVue is fully-typed and structured with simplicity in mind, ensuring that components are easy to use and integrate.

Performance & Tree-Shaking

Our library is designed with performance in mind. All components are compiled into a single package, making installation straightforward and ensuring that any unused components won’t add to your bundle size thanks to tree-shaking.