Some properties provide flexibility for specific integrations. Follow the component's usage guidance. Customizations beyond the documented patterns need a use case approved by DNB UX. Read about intended use and customization.
Properties#
| Type | Description | |
|---|---|---|
brand | "ui" "eiendom" "sbanken" "carnegie" | (optional) The branding theme. Can be ui (universal identity), eiendom, sbanken or carnegie. |
name | "ui" "eiendom" "sbanken" "carnegie" | (deprecated) Deprecated. Use brand instead. |
density | "basis" | (optional) Defines the component density (WIP). |
size | "basis" | (deprecated) Deprecated. Use density instead. |
variant | string | (optional) (WIP). |
contrastMode | boolean | (optional) When a component supports a contrast style, it will be used instead for the dedicated area. |
colorScheme | "auto" "light" "dark" | (optional) Controls the color scheme. Use auto to follow system preference and switch automatically between light and dark, light for light mode or dark for dark mode. When not set, the color scheme of a parent Theme is used. |
surface | "dark" "light" "initial" | (optional) Adjusts component appearance based on background. Use dark when content is placed on a dark surface, light for light, or initial to reset to the component's default behavior, ignoring any parent surface context. Defaults to undefined. |
typography | "native" "web" | (optional) Selects the brand's native app or web font size for body text and control labels in this Theme and its Eufemia React portals. Inherits from the parent Theme. Use web to override a native parent. Line heights and control dimensions stay the same. |