# Common Props

There are common settings used by all components such as variant, color and size. These are listed below.

## Color

```lua
Element.color = {
    Primary = 'primary',
    Secondary = 'secondary',
    Success = 'success',
    Danger = 'danger',
    Warning = 'warning',
    Info = 'info',
    Light = 'light',
    Dark = 'dark',
    White = 'white',
    Black = 'black',
}
```

#### Example

<pre class="language-lua"><code class="lang-lua">local button = Button:new(
<strong>    Vector2(0, 0),
</strong>    nil,
    'Red Button',
    nil,
    Element.color.Danger,
    nil)
</code></pre>

## Size

```
Element.size = {
    Small = 'small',
    Medium = 'medium',
    Large = 'large',
}
```

#### Example

<pre class="language-lua"><code class="lang-lua">local button = Button:new(
<strong>    Vector2(0, 0),
</strong>    nil,
    'Primary Small Button',
    nil,
    Element.color.Danger,
    Element.size.Small)
</code></pre>
