# PaymentSheetColors

Controls all colors in the PaymentSheet. Pass an instance to the `paymentSheetColors` parameter of any [PaymentSheet](/android/online/payment-sheet) composable.

All properties are optional. Omit any you don't need and the default value will be used.


```kotlin
data class PaymentSheetColors(
    val surface: Color = Color.White,
    val logoTextColor: Color = Color.Black,
    val textColor: Color = Color.Black,
    val errorContainerColor: Color = FinixErrorTextSurface,
    val containerColor: Color = FinixGray,
    val focusedIndicatorColor: Color = FinixBlue,
    val unfocusedIndicatorColor: Color = Color.Transparent,
    val focusedLabelColor: Color = FinixBlue,
    val unfocusedLabelColor: Color = Color.Black,
    val placeholderColor: Color = FinixPlaceHolderTextGray,
    val errorBorderColor: Color = FinixErrorRed,
    val errorLabelColor: Color = FinixErrorRed,
    val errorPlaceholderColor: Color = FinixPlaceHolderTextGray,
    val tokenizeButtonColor: Color = FinixBlue,
    val tokenizeButtonTextColor: Color = Color.White,
    val cancelButtonColor: Color = FinixRed,
    val cancelButtonTextColor: Color = Color.White,
)
```

## Background & Text

| Property | Default | Description |
|  --- | --- | --- |
| `surface` | `Color.White` | Background color of the entire sheet. |
| `textColor` | `Color.Black` | Color of text inside input fields. |
| `logoTextColor` | `Color.Black` | Color of the logo label at the top of the form. |
| `containerColor` | `FinixGray` | Background fill color of each input field. |


## Field States

| Property | Default | Description |
|  --- | --- | --- |
| `focusedIndicatorColor` | `FinixBlue` | Border color of the active (focused) field. |
| `unfocusedIndicatorColor` | `Color.Transparent` | Border color of inactive fields. |
| `focusedLabelColor` | `FinixBlue` | Label color when the field is active. |
| `unfocusedLabelColor` | `Color.Black` | Label color when the field is inactive. |
| `placeholderColor` | `FinixPlaceHolderTextGray` | Color of placeholder text inside fields. |


## Error States

| Property | Default | Description |
|  --- | --- | --- |
| `errorBorderColor` | `FinixErrorRed` | Border color when a field has a validation error. |
| `errorLabelColor` | `FinixErrorRed` | Label color when a field has a validation error. |
| `errorContainerColor` | `FinixErrorTextSurface` | Background fill of a field in error state. |
| `errorPlaceholderColor` | `FinixPlaceHolderTextGray` | Placeholder color in error state. |


## Buttons

| Property | Default | Description |
|  --- | --- | --- |
| `tokenizeButtonColor` | `FinixBlue` | Background color of the submit button. |
| `tokenizeButtonTextColor` | `Color.White` | Text color of the submit button. |
| `cancelButtonColor` | `FinixRed` | Background color of the cancel button. |
| `cancelButtonTextColor` | `Color.White` | Text color of the cancel button. |


## Full Example

Pass `PaymentSheetColors` to any PaymentSheet composable via the `paymentSheetColors` parameter.