Skip to main content

Theming Overview

Customize the look and feel of your Buildocs UI Engine.

How Theming Works​

Buildocs UI Engine uses a CSS-based theming system that allows you to:

  • Match your application's design system
  • Support light and dark modes
  • Apply project-level or tenant-level themes

Enabling Theming​

Theming is supported by default — no extra setup required. Once your app is wrapped with BuildocsProvider, the theming system is active automatically. All forms rendered inside it inherit the active theme.

import { BuildocsProvider } from '@buildocsdev/sdk';

<BuildocsProvider apiKey="your-api-key">
  {/* theming is active for everything inside */}
  <FormHostProvider>
    <Form params={...} />
  </FormHostProvider>
</BuildocsProvider>

Where to configure the theme​

Theme customization is done inside Buildocs under Project Settings → UI / Appearance:

  1. Open your project and go to Settings
  2. Select the UI / Appearance tab
  3. Adjust colors, typography, and other visual options
  4. Save — the changes apply to all forms in that project immediately

The theme configured here is automatically applied when the form is rendered inside BuildocsProvider.