> For the complete documentation index, see [llms.txt](https://docs.manifold.xyz/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.manifold.xyz/manifold-for-developers/resources/widgets/restricted-token-widget/customization-and-styling.md).

# Customization & Styling

The restricted token widget has simplistic dark and light mode styles. By default, it renders according to the end-user's preferred OS color scheme. The widget can be easily stylized by changing the appropriate Manifold CSS Variables.

## Manifold CSS Variables

{% hint style="info" %}
This section assumes you have basic HTML and CSS knowledge.
{% endhint %}

You can also customize the identity widget using the Manifold CSS variables.

The following list of variables are those that have an effect on the identity widget:

### Text

* `--manifold-text--font-family--body`: affects the font-family of the widget.
* `--manifold-text--font-size--body`: affects the font-size of the widget.
* `--manifold-text--color--body`: affects the default color of the widget text.
* `--manifold-text--color--muted`: affects the default color for the Twitter handle (if it exists).

### Other

* `--manifold-element--color--background`: affects the popup menu's background colour.
* `--manifold-border--color`: affects the colour of any borders on the widget.
* `--manifold-border--color:` affects the outline color of the popup.
