description: Accessible, themeable web components built with Craftit for framework and vanilla DOM apps. package: buildit category: ui-components keywords: [web-components, accessible, themeable, ui, components, design-system] related: [craftit, floatit, formit] exports: [bit-button, bit-input, bit-dialog, bit-select, bit-form]

@vielzeug/buildit

Accessible, themeable web components built with Craftit for framework and vanilla DOM apps.

Package: @vielzeug/buildit  ·  Category: Ui-components

Key exports: bit-button, bit-input, bit-dialog, bit-select, bit-form

When to use: Accessible, themeable web components built with Craftit for framework and vanilla DOM apps.

Related: @vielzeug/craftit · @vielzeug/floatit · @vielzeug/formit

@vielzeug/buildit is part of Vielzeug and ships as a zero-dependency TypeScript package with ESM+CJS output.

Installation

pnpm add @vielzeug/buildit
npm install @vielzeug/buildit
yarn add @vielzeug/buildit

Quick Start

// Required once: design tokens + base component styles
import '@vielzeug/buildit/styles';

// Register only the components you use
import '@vielzeug/buildit/button';
import '@vielzeug/buildit/card';
import '@vielzeug/buildit/input';

<bit-button variant="solid" color="primary">Save</bit-button>

<bit-input label="Email" type="email" required></bit-input>

<bit-card padding="lg">
  <span slot="header">Account</span>
  <p>Build forms, layouts, overlays, and feedback UI with native custom elements.</p>
</bit-card>

To register everything at once:

import '@vielzeug/buildit/styles';
import '@vielzeug/buildit';

Documentation

• Overview
• Usage Guide
• API Reference
• Examples

License

MIT © Helmuth Saatkamp — part of the Vielzeug monorepo.