Skip to content

Ngx meta.standard.themecolor

Home > @davidlj95/ngx-meta > Standard > themeColor

Standard.themeColor property

Sets one or more <meta name='theme-color'> HTML elements.

Signature:

readonly themeColor?: StandardThemeColorMetadata | null;

Remarks

If set, color(s) must specify a valid CSS color.

A media attribute can be set to specify a different color depending on the context based on a CSS media query. For instance, to provide one color for dark mode and another for light mode.

You can use a string value to set one theme color as value. No media attribute will be used then.

You can also specify one or more colors and media queries combinations by providing an array of StandardThemeColorMetadataObject specifying the color and (optionally) a media query.

Not related to SEO.

Provider:

STANDARD_THEME_COLOR_METADATA_PROVIDER

See also:

Example

Providing just one theme color:

const themeColor: Standard['themeColor'] = 'lightblue'
Providing multiple theme colors based on a media query:

const themeColor: StandardThemeColorMetadata = [
  {color: 'darkblue', media: '(prefers-color-scheme: dark)'}
  {color: 'lightblue'}, // Default (when user does not prefer dark)
]