[create-theme]: Zen Chameleon

[AbdulkadirBastug]

Name

Adaptive Color

Description

Dynamic theme that changes sidebar and toolbar colors based on the website's brand color.

Homepage

No response

Image

https://imgur.com/a/Ef2SyM2

Type

• JSON Color Theme

Theme Styles

/* * Zen Chameleon 
 * Automatically syncs Sidebar and Toolbar with website branding
 */

#zen-sidebar, 
#nav-bar, 
#TabsToolbar {
  background-color: var(--zen-primary-color) !important;
  transition: background-color 0.8s ease-in-out !important;
}

/* Ensures icons and text are readable on dynamic backgrounds */
#zen-sidebar *, 
#nav-bar * {
  color: white !important;
  fill: white !important;
  text-shadow: 0px 1px 2px rgba(0,0,0,0.2);
}

Readme

# Zen Chameleon

**Zen Chameleon** is a dynamic theme for Zen Browser that automatically syncs your sidebar, toolbar, and tabs with the branding color of the website you are currently visiting.

Preferences

{
  "zen.theme.chameleon.enable-animation": {
    "label": "Enable Smooth Transitions",
    "type": "boolean",
    "default": true,
    "description": "Fades colors smoothly when switching between websites (YouTube Music style)."
  },
  "zen.theme.chameleon.sidebar-contrast": {
    "label": "Sidebar Contrast Boost",
    "type": "boolean",
    "default": true,
    "description": "Automatically adjusts text and icon colors to ensure visibility against the background."
  },
  "zen.theme.chameleon.opacity": {
    "label": "UI Opacity",
    "type": "integer",
    "default": 100,
    "min": 10,
    "max": 100,
    "description": "Adjust the transparency of the sidebar and toolbar."
  }
}

[github-actions]

Error creating theme

Sorry about that! There was an error creating the theme. Please try again or contact the maintainers for help.

Label for zen.theme.chameleon.enable-animation is required.