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

# Interface: StripeElementCSSProperties

CSS properties supported by Stripe.js.

## Hierarchy

* **StripeElementCSSProperties**

  ↳ [StripeElementStyleVariant](stripeelementstylevariant.md)

## Index

### Properties

* [backgroundColor](stripeelementcssproperties.md#optional-backgroundcolor)
* [color](stripeelementcssproperties.md#optional-color)
* [fontFamily](stripeelementcssproperties.md#optional-fontfamily)
* [fontSize](stripeelementcssproperties.md#optional-fontsize)
* [fontSmoothing](stripeelementcssproperties.md#optional-fontsmoothing)
* [fontStyle](stripeelementcssproperties.md#optional-fontstyle)
* [fontVariant](stripeelementcssproperties.md#optional-fontvariant)
* [fontWeight](stripeelementcssproperties.md#optional-fontweight)
* [iconColor](stripeelementcssproperties.md#optional-iconcolor)
* [letterSpacing](stripeelementcssproperties.md#optional-letterspacing)
* [lineHeight](stripeelementcssproperties.md#optional-lineheight)
* [padding](stripeelementcssproperties.md#optional-padding)
* [textAlign](stripeelementcssproperties.md#optional-textalign)
* [textDecoration](stripeelementcssproperties.md#optional-textdecoration)
* [textShadow](stripeelementcssproperties.md#optional-textshadow)
* [textTransform](stripeelementcssproperties.md#optional-texttransform)

## Properties

### `Optional` backgroundColor

• **backgroundColor**? : *undefined | 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.

___

### `Optional` color

• **color**? : *undefined | string*

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

___

### `Optional` fontFamily

• **fontFamily**? : *undefined | string*

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

___

### `Optional` fontSize

• **fontSize**? : *undefined | string*

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

___

### `Optional` fontSmoothing

• **fontSmoothing**? : *undefined | string*

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

___

### `Optional` fontStyle

• **fontStyle**? : *undefined | string*

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

___

### `Optional` fontVariant

• **fontVariant**? : *undefined | string*

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

___

### `Optional` fontWeight

• **fontWeight**? : *undefined | string*

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

___

### `Optional` iconColor

• **iconColor**? : *undefined | string*

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

___

### `Optional` letterSpacing

• **letterSpacing**? : *undefined | string*

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

___

### `Optional` lineHeight

• **lineHeight**? : *undefined | 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.

___

### `Optional` padding

• **padding**? : *undefined | string*

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

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

___

### `Optional` textAlign

• **textAlign**? : *undefined | 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.

___

### `Optional` textDecoration

• **textDecoration**? : *undefined | string*

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

___

### `Optional` textShadow

• **textShadow**? : *undefined | string*

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

___

### `Optional` textTransform

• **textTransform**? : *undefined | string*

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