Modern Vue UI. Native by design.

Vue 3 components built on web standards. Native CSS tokens, accessible interactions, and Vue as the only runtime dependency.

Components

Real components, themed by tokens

Everything in this window is live. Pick an accent to repaint it with CSS tokens alone.

Revenue

This month

€48.2k

12%

Quarterly goal

Projects

Three active this week

Invite a teammate

Role

Send a welcome email

Notifications

Weekly digest

Sound

Principles

Components use semantic HTML, native browser APIs and CSS layers. Vue is the only runtime dependency.

No additional runtime library or CSS framework is required.

Components use features such as the Popover API and CSS Anchor Positioning. A recent browser is required.

Adjust colours, spacing and typography with CSS custom properties shared across components.

Library styles use CSS layers (@layer). Override them with unlayered CSS in your application.

Components support server-side rendering in Vue and Nuxt applications.

Use the built-in icons or provide SVG paths, images, components or icon fonts.

Accessibility

Components include keyboard interactions, ARIA states and reduced-motion styles. Automated axe checks run in both themes.

Get started

Install the package, load the global styles and import your components.

bash

# Install the package with your package manager.

pnpm add vectis-ui vue

// main.ts
// Import the global styles in your application's entry point.

import 'vectis-ui/styles.css'

// App.vue
// Import the components you need.

import { VButton } from 'vectis-ui'

Install the package, or shape a theme first and copy its tokens.