Skip to main content

Get Started

Install BEEQ in your project and start building in minutes.

Components

Explore 43 production-ready UI components.

Framework Guides

Use BEEQ with Angular, React, Vue, or plain HTML.

Theming

Customize the design system with CSS variables and TailwindCSS tokens.

​
What is BEEQ?

BEEQ is a design system and web component library built by Endava. It provides a collection of accessible, framework-agnostic UI components built on top of StencilJS and styled with TailwindCSS. BEEQ components work as native HTML custom elements in any web environment.

​
Why BEEQ?

Framework Agnostic

Components are standard Web Components that work everywhere — no framework lock-in.

Framework Wrappers

First-class wrappers for Angular, React, and Vue with native event and data binding.

Accessible by Default

Components follow WCAG accessibility guidelines with proper ARIA attributes and keyboard support.

TailwindCSS Integration

An opinionated TailwindCSS preset ships BEEQ design tokens directly into your Tailwind config.

Custom Properties

Every component exposes CSS custom properties so you can override styles without specificity battles.

Custom Events

All component events are prefixed with bq to prevent collisions with native browser events.

​
Packages

PackageDescription
@beeq/coreCore web components — works anywhere
@beeq/angularAngular wrapper with NG_VALUE_ACCESSOR support
@beeq/reactReact wrapper with synthetic event mapping
@beeq/vueVue 3 wrapper with v-model support
@beeq/tailwindcssTailwindCSS preset with BEEQ design tokens

​
Quick example

Use BEEQ components directly in any HTML page via CDN: 
<html>
  <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@beeq/core/dist/beeq/beeq.css" />
    <script type="module" src="https://cdn.jsdelivr.net/npm/@beeq/core/dist/beeq/beeq.esm.js"></script>
  </head>
  <body>
    <bq-button appearance="primary" size="medium">
      Click me!
    </bq-button>

    <bq-input placeholder="Enter your email">
      <label slot="label">Email</label>
    </bq-input>
  </body>
</html>
All BEEQ component tags are prefixed with bq- to clearly distinguish them from native HTML elements.

​
License

BEEQ is open source software released under the Apache 2.0 License.

Build docs developers (and LLMs) love

Get started for freeTalk to us