Skip to content

Using theme-color Meta Tag

View on Twitter

💡 Use the theme-color meta tag to create a seamless experience between the browser interface and your site's top nav bar:

➡️ <meta name="theme-color" content="#dc3838">

Works on Android (Chrome, Brave, Samsung) and iOS (Safari 15), as well as on desktop! (macOS Safari 15)

Screenshot of maximorlov.com homepage on desktop showing a red top navigation bar with a smooth transition to, an equally red, browser interface.

Screenshot of maximorlov.com homepage on mobile showing a red top navigation bar with a smooth transition to, an equally red, mobile status bar.

You might also like

Validate Github Action Workflow in VSCode Read tip

Restrict SSH Key to Specific Commands Read tip

Colour Contrast for Accessibility Read tip