# Configuration

## Basic configuration

***

### Corner type

**Field type**:\
Select

**Available values**:\
• not rounded (default)\
• round corners\
• individual radius

**Example value**:\
`not rounded (default)`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Basic configuration"

**Technical name**:\
`twt-widget-newsletter-input-corner-type`

{% hint style="info" %}
**rounded corners**\
Uses the configuration "Border radius". ("Layout" > "Layout" > "Border radius")

**round corners**\
Uses a predefined radius for round corners.
{% endhint %}

***

### Border radius (individual radius)

**Field type**:\
Number field

**Example value**:\
`10`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Basic configuration"

**Technical name**:\
`twt-widget-newsletter-input-border-radius`

{% hint style="info" %}
**Note**: This configuration relates to the corner type "individual radius".
{% endhint %}

## Colour configuration

***

### Text colour (Input)

**Field type**:\
Color picker

**Example value**:\
`#333333`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-input-color`

***

### Border colour (Input)

**Field type**:\
Color picker

**Example value**:\
`#ffffff`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-input-border-color`

***

### Background colour (Input)

**Field type**:\
Color picker

**Example value**:\
`#ffffff`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-input-background-color`

***

### Icon colour (Button)

**Field type**:\
Color picker

**Example value**:\
`#ffffff`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-button-color`

***

### Icon colour (Button) @hover

**Field type**:\
Color picker

**Example value**:\
`#eeeeee`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-button-color-hover`

***

### Border colour (Button)

**Field type**:\
Color picker

**Example value**:\
`#eeeeee`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-button-border-color`

***

### Border colour (Button) @hover

**Field type**:\
Color picker

**Example value**:\
`#ffffff`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-button-border-color-hover`

***

### Background colour (Button)

**Field type**:\
Color picker

**Example value**:\
`#0e557b`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-button-background-color`

***

### Background colour (Button) @hover

**Field type**:\
Color picker

**Example value**:\
`$twt-color-brand-primary-dark`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Colour configuration"

**Technical name**:\
`twt-widget-newsletter-button-background-color-hover`

## Typography

***

### Text alignment (Input)

**Field type**:\
Select

**Available values**:\
• align left\
• align center\
• align right

**Example value**:\
`align left`

**Path to the configuration**:\
Tab "Widgets" => Block "Newsletter" => Section "Typography"

**Technical name**:\
`twt-widget-newsletter-input-text-align`