Skip to content

Add Dracula/Alucard System Theme #17

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ericstephenr wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add Dracula/Alucard System Theme #17

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
106 changes: 106 additions & 0 deletions Addon/system/manifest.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
{
"manifest_version": 2,
"version": "1.0",
"name": "Dracula/Alucard System Theme",
"short_name": "Dracula/Alucard",

"browser_specific_settings": {
"gecko": {
"strict_min_version": "142.0.1"
}
},

"theme": {
"colors": {
"button_background_active": "rgb(210, 210, 210)",
"button_background_hover": "rgb(230, 230, 230)",
"frame": "rgb(230, 230, 230)",
"icons": "rgb(40, 42, 54)",
"icons_attention": "rgb(189, 147, 249)",
"ntp_background": "rgb(230, 230, 230)",
"ntp_text": "rgb(255, 42, 54)",
"popup": "rgb(230, 230, 230)",
"popup_text": "rgb(40, 42, 54)",
"popup_border": "rgb(98, 114, 164)",
"popup_highlight": "rgb(98, 114, 164)",
"popup_highlight_text": "rgb(248, 248, 242)",
"sidebar": "rgb(230, 230, 230)",
"sidebar_border": "rgb(98, 114, 164)",
"sidebar_highlight": "rgb(98, 114, 164)",
"sidebar_highlight_text": "rgb(248, 248, 242)",
"sidebar_text": "rgb(40, 42, 54)",
"tab_background_separator": "rgb(98, 114, 164)",
"tab_background_text": "rgb(68, 71, 90)",
"tab_loading": "rgb(98, 114, 164)",
"tab_selected": "rgb(248, 248, 242)",
"tab_line": "rgb(255, 248, 242)",
"tab_text": "rgb(40, 42, 54)",
"toolbar": "rgb(248, 248, 242)",
"toolbar_bottom_separator": "rgb(68, 71, 90)",
"toolbar_field": "rgb(230, 230, 230)",
"toolbar_field_border": "rgb(98, 114, 164)",
"toolbar_field_border_focus": "rgb(98, 114, 164)",
"toolbar_field_highlight": "rgb(98, 114, 164)",
"toolbar_field_highlight_text": "rgb(248, 248, 242)",
"toolbar_field_text": "rgb(40, 42, 54)",
"toolbar_text": "rgb(40, 42, 54)",
"toolbar_top_separator": "rgb(40, 42, 54)",
"toolbar_vertical_separator": "rgb(98, 114, 164)"
},
"properties": {
"color_scheme": "light",
"panel_hover": "color-mix(in srgb, currentColor 9%, transparent)",
"panel_active": "color-mix(in srgb, currentColor 14%, transparent)",
"panel_active_darker": "color-mix(in srgb, currentColor 25%, transparent)",
"toolbar_field_icon_opacity": "1",
"zap_gradient": "linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%)"
}
Comment on lines +50 to +57

@coderabbitai coderabbitai Bot Sep 6, 2025

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Verification agent

🧩 Analysis chain

Non-standard theme properties will be ignored without a theme_experiment.

panel_hover, panel_active, panel_active_darker, toolbar_field_icon_opacity, and zap_gradient aren’t part of the public theme schema and will not apply unless you declare a theme_experiment (which AMO typically does not allow for public themes). Recommend removing.

-    "properties": {
-      "color_scheme": "light",
-      "panel_hover": "color-mix(in srgb, currentColor 9%, transparent)",
-      "panel_active": "color-mix(in srgb, currentColor 14%, transparent)",
-      "panel_active_darker": "color-mix(in srgb, currentColor 25%, transparent)",
-      "toolbar_field_icon_opacity": "1",
-      "zap_gradient": "linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%)"
-    }
+    "properties": {
+      "color_scheme": "light"
+    }

🌐 Web query:

Are custom theme properties like panel_hover and zap_gradient supported in Firefox static themes without theme_experiment? Is theme_experiment allowed on AMO for third-party themes?

💡 Result:

Short answer: No — only the standard theme keys documented by MDN are supported in regular static themes. Custom UI CSS via theme_experiment (which is how things like extra CSS-driven variables/gradients are exposed in Mozilla’s built‑in themes) is an experimental mechanism and not usable for third‑party themes on AMO. Themes that rely on theme_experiment cannot be signed/submitted for distribution on AMO (theme experiments are used for Mozilla‑vetted/built‑in experiments only).

Sources: MDN theme/theme_experiment docs [1][2], Firefox built‑in theme manifest showing zap_gradient used with theme_experiment [3], community/AMO notes that theme_experiment themes can’t be submitted/signed for AMO distribution [4].

References

  1. MDN — theme (manifest.json).
  2. MDN — theme_experiment (manifest.json).
  3. Firefox built‑in Dark theme manifest (shows zap_gradient & theme_experiment).
  4. Community/AMO discussion (theme_experiment not allowed for third‑party AMO themes).

Remove non-standard theme properties from manifest.json
Custom keys (panel_hover, panel_active, panel_active_darker, toolbar_field_icon_opacity, zap_gradient) aren’t part of MDN’s static theme schema and require a theme_experiment, which third-party AMO themes cannot use—these entries will be ignored and must be removed.

🤖 Prompt for AI Agents 
In Addon/system/manifest.json around lines 50 to 57, remove the non-standard
theme properties (panel_hover, panel_active, panel_active_darker,
toolbar_field_icon_opacity, zap_gradient) because they are not part of MDN’s
static theme schema and require a theme_experiment which third-party AMO themes
cannot use; delete these custom keys from the "properties" block and keep only
standard theme fields (e.g., color_scheme) so the manifest validates against the
static theme schema, or if you must retain those visuals document them elsewhere
and implement via an approved extension experiment rather than in this manifest.

},

"dark_theme": {
"colors": {
"button_background_active": "rgb(40, 42, 54)",
"button_background_hover": "rgb(98, 114, 164)",
"frame": "rgb(40, 42, 54)",
"icons": "rgb(248, 248, 242)",
"icons_attention": "rgb(189, 147, 249)",
"ntp_background": "rgb(40, 42, 54)",
"ntp_text": "rgb(248, 248, 242)",
"popup": "rgb(40, 42, 54)",
"popup_border": "rgb(98, 114, 164)",
"popup_highlight": "rgb(98, 114, 164)",
"popup_highlight_text": "rgb(248, 248, 242)",
"popup_text": "rgb(255, 255, 255)",
"sidebar": "rgb(40, 42, 54)",
"sidebar_border": "rgb(98, 114, 164)",
"sidebar_highlight": "rgb(98, 114, 164)",
"sidebar_highlight_text": "rgb(248, 248, 242)",
"sidebar_text": "rgb(248, 248, 242)",
"tab_background_separator": "rgb(98, 114, 164)",
"tab_background_text": "rgb(199, 202, 210)",
"tab_loading": "rgb(98, 114, 164)",
"tab_selected": "rgb(98, 114, 164)",
"tab_line": "rgb(98, 114, 164)",
"tab_text": "rgb(248, 248, 242)",
"toolbar": "rgb(68, 71, 90)",
"toolbar_bottom_separator": "rgb(68, 71, 90)",
"toolbar_field": "rgb(40, 42, 54)",
"toolbar_field_border": "rgb(98, 114, 164)",
"toolbar_field_border_focus": "rgb(189, 147, 249)",
"toolbar_field_highlight": "rgb(68, 71, 90)",
"toolbar_field_highlight_text": "rgb(248, 248, 242)",
"toolbar_field_text": "rgb(255, 255, 255)",
"toolbar_text": "rgb(255, 255, 255)",
"toolbar_top_separator": "rgb(40, 42, 54)",
"toolbar_vertical_separator": "rgb(98, 114, 164)"
},
"properties": {
"color_scheme": "dark",
"panel_hover": "color-mix(in srgb, currentColor 9%, transparent)",
"panel_active": "color-mix(in srgb, currentColor 14%, transparent)",
"panel_active_darker": "color-mix(in srgb, currentColor 25%, transparent)",
"toolbar_field_icon_opacity": "1",
"zap_gradient": "linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%)"
}
Comment on lines +97 to +104

@coderabbitai coderabbitai Bot Sep 6, 2025

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Repeat: remove unsupported dark properties.

Mirror the light-side change; keep only color_scheme: "dark" to avoid ignored fields.

-    "properties": {
-      "color_scheme": "dark",
-      "panel_hover": "color-mix(in srgb, currentColor 9%, transparent)",
-      "panel_active": "color-mix(in srgb, currentColor 14%, transparent)",
-      "panel_active_darker": "color-mix(in srgb, currentColor 25%, transparent)",
-      "toolbar_field_icon_opacity": "1",
-      "zap_gradient": "linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%)"
-    }
+    "properties": {
+      "color_scheme": "dark"
+    }
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
"properties": {
"color_scheme": "dark",
"panel_hover": "color-mix(in srgb, currentColor 9%, transparent)",
"panel_active": "color-mix(in srgb, currentColor 14%, transparent)",
"panel_active_darker": "color-mix(in srgb, currentColor 25%, transparent)",
"toolbar_field_icon_opacity": "1",
"zap_gradient": "linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%)"
}
"properties": {
"color_scheme": "dark"
}
🤖 Prompt for AI Agents 
In Addon/system/manifest.json around lines 97 to 104, the manifest includes
unsupported dark theme properties that will be ignored; remove all entries
inside "properties" except keep "color_scheme": "dark" (i.e., delete
panel_hover, panel_active, panel_active_darker, toolbar_field_icon_opacity,
zap_gradient) so the properties object only contains the single supported
color_scheme key.

}
}