# SpectrumBar

Group: Foundations

The logo's colors as whole, adjacent stripes — Visualli's signature in place of a gradient.
- `variant="bar"` (default) for edges of bands, emails and cards; `"letters"` follows the wordmark's letter order as dots; `"dots"` for loaders and dividers.
- `size` is the bar height or dot diameter in px.
- Use at most once per view. Never blend the colors, never put text on it.


## Props

```ts
export interface SpectrumBarProps { variant?: 'bar' | 'dots' | 'letters'; size?: number; label?: string }
```

## Use

```ts
import { SpectrumBar } from '@visualli/design-system/components';
```