[**@bigcommerce/checkout-sdk**](../README.md)

***

[@bigcommerce/checkout-sdk](../README.md) / StripeElementCSSProperties

# Interface: StripeElementCSSProperties

CSS properties supported by Stripe.js.

## Extended by

- [`StripeElementStyleVariant`](StripeElementStyleVariant.md)

## Properties

### backgroundColor?

> `optional` **backgroundColor?**: `string`

The [background-color](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color) CSS property.

This property works best with the `::selection` pseudo-class.
In other cases, consider setting the background color on the element's container instaed.

***

### color?

> `optional` **color?**: `string`

The [color](https://developer.mozilla.org/en-US/docs/Web/CSS/color) CSS property.

***

### fontFamily?

> `optional` **fontFamily?**: `string`

The [font-family](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) CSS property.

***

### fontSize?

> `optional` **fontSize?**: `string`

The [font-size](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size) CSS property.

***

### fontSmoothing?

> `optional` **fontSmoothing?**: `string`

The [font-smoothing](https://developer.mozilla.org/en-US/docs/Web/CSS/font-smoothing) CSS property.

***

### fontStyle?

> `optional` **fontStyle?**: `string`

The [font-style](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style) CSS property.

***

### fontVariant?

> `optional` **fontVariant?**: `string`

The [font-variant](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant) CSS property.

***

### fontWeight?

> `optional` **fontWeight?**: `string`

The [font-weight](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) CSS property.

***

### iconColor?

> `optional` **iconColor?**: `string`

A custom property, used to set the color of the icons that are rendered in an element.

***

### letterSpacing?

> `optional` **letterSpacing?**: `string`

The [letter-spacing](https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing) CSS property.

***

### lineHeight?

> `optional` **lineHeight?**: `string`

The [line-height](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) CSS property.

To avoid cursors being rendered inconsistently across browsers, consider using a padding on the element's container instead.

***

### padding?

> `optional` **padding?**: `string`

The [padding](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) CSS property.

Available for the `idealBank` element.
Accepts integer `px` values.

***

### textAlign?

> `optional` **textAlign?**: `string`

The [text-align](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align) CSS property.

Available for the `cardNumber`, `cardExpiry`, and `cardCvc` elements.

***

### textDecoration?

> `optional` **textDecoration?**: `string`

The [text-decoration](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration) CSS property.

***

### textShadow?

> `optional` **textShadow?**: `string`

The [text-shadow](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow) CSS property.

***

### textTransform?

> `optional` **textTransform?**: `string`

The [text-transform](https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform) CSS property.