# UI Maker Themes Configuration

> How to apply and customize themes in UI Maker.

Source: https://docs.apimaker.dev/v1/extensions/ui_maker/supported_themes.html

> **UI Maker is deprecated**
>
> UI Maker is kept for the projects which use it and will be removed in API Maker v4. New admin screens are better built with any frontend framework on top of the [generated APIs](https://docs.apimaker.dev/v1/docs/apis-all/overview.html).

👉 It supports many themes listed below.

👉 You can display theme selector in grid header "showThemeSelector".

## Example

```typescript
export interface IDBMasterConfig {
    theme: T.EDBMasterTheme.MD_DARK_DEEPPURPLE,
    showThemeSelector: true,
}
```

## Interface Documentation

```typescript
export interface IDBMasterConfig {
    theme?: EDBMasterTheme;

    /** Default : false */
    showThemeSelector?: boolean;
}

export enum EDBMasterTheme {
    BOOTSTRAP4_LIGHT_BLUE = 'bootstrap4-light-blue',
    BOOTSTRAP4_LIGHT_PURPLE = 'bootstrap4-light-purple',
    BOOTSTRAP4_DARK_BLUE = 'bootstrap4-dark-blue',
    BOOTSTRAP4_DARK_PURPLE = 'bootstrap4-dark-purple',
    MD_LIGHT_INDIGO = 'md-light-indigo',
    MD_LIGHT_DEEPPURPLE = 'md-light-deeppurple',
    MD_DARK_INDIGO = 'md-dark-indigo',
    MD_DARK_DEEPPURPLE = 'md-dark-deeppurple',
    MDC_LIGHT_INDIGO = 'mdc-light-indigo',
    MDC_LIGHT_DEEPPURPLE = 'mdc-light-deeppurple',
    MDC_DARK_INDIGO = 'mdc-dark-indigo',
    MDC_DARK_DEEPPURPLE = 'mdc-dark-deeppurple',
    FLUENT_LIGHT = 'fluent-light',
    LARA_LIGHT_BLUE = 'lara-light-blue',
    LARA_LIGHT_INDIGO = 'lara-light-indigo',
    LARA_LIGHT_PURPLE = 'lara-light-purple',
    LARA_LIGHT_TEAL = 'lara-light-teal',
    LARA_DARK_BLUE = 'lara-dark-blue',
    LARA_DARK_INDIGO = 'lara-dark-indigo',
    LARA_DARK_PURPLE = 'lara-dark-purple',
    LARA_DARK_TEAL = 'lara-dark-teal',
    SOHO_LIGHT = 'soho-light',
    SOHO_DARK = 'soho-dark',
    VIVA_LIGHT = 'viva-light',
    VIVA_DARK = 'viva-dark',
    MIRA = 'mira',
    NANO = 'nano',
    SAGA_BLUE = 'saga-blue',
    SAGA_GREEN = 'saga-green',
    SAGA_ORANGE = 'saga-orange',
    SAGA_PURPLE = 'saga-purple',
    VELA_BLUE = 'vela-blue',
    VELA_GREEN = 'vela-green',
    VELA_ORANGE = 'vela-orange',
    VELA_PURPLE = 'vela-purple',
    ARYA_BLUE = 'arya-blue',
    ARYA_GREEN = 'arya-green',
    ARYA_ORANGE = 'arya-orange',
    ARYA_PURPLE = 'arya-purple',
    NOVA = 'nova',
    NOVA_ALT = 'nova-alt',
    NOVA_ACCENT = 'nova-accent',
    LUNA_AMBER = 'luna-amber',
    LUNA_BLUE = 'luna-blue',
    LUNA_GREEN = 'luna-green',
    LUNA_PINK = 'luna-pink',
    RHEA = 'rhea',
}
```