> For the complete documentation index, see [llms.txt](https://firstoken.gitbook.io/api-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://firstoken.gitbook.io/api-docs/guides/implementing-captures-sdk-js/css-object.md).

# CSS Object

The Firstoken SDK sends a CSS object for each field, allowing for customization of field appearance based on design needs. This object can be unique for each field or general for all fields, depending on the client's design.

For this element, CSS tags and pseudo-classes can be used. CSS tags are used in the following format: "color": "#FFFFFF". If there are multiple elements, a comma is used after each key-value pair. On the other hand, if a pseudo-class is used, for example, "placeholder", it is used in the following format: "::placeholder": { "color": "#FFFFFF" }. The double colon ":" informs the SDK that a pseudo-class with a second level in the object is being referred to.

| These are some of CSS tags are allowed:      | <ul><li>font-family</li><li>font-weight</li><li>color</li><li>background-color</li><li>height</li><li>padding</li><li>font-size</li><li>font-style</li><li>text-transform</li><li>border</li><li>font-weight</li><li>border-radius</li><li>box-sizing</li><li>margin</li><li>border-top-right-radius</li><li>border-top-left-radius</li><li>border-bottom-right-radius</li><li>border-bottom-left-radius</li></ul> |
| -------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| These are some of the allowed pseudo-classes | <ul><li>placeholder</li><li>after</li><li>before</li><li>hover</li><li>focus</li></ul>                                                                                                                                                                                                                                                                                                                             |

These are the Font family that are allowed in SDK

{% tabs %}
{% tab title="Web Safe Fonts" %}

* Arial
* Helvetica
* Verdana
* Tahoma
* Trebuchet MS
* Times New Roman
* Georgia
* Garamond
* Courier New
* Brush Script MT
  {% endtab %}

{% tab title="Google Fonts" %}

* Lato
* Montserrat
* Open Sans
* Oswald
* Poppins
* Roboto
* Raleway
* Slabo 13px
* Slabo 27px
* PT Sans
* Inter
  {% endtab %}
  {% endtabs %}