Skip to content

Latest commit

 

History

History
71 lines (45 loc) · 3.13 KB

themes.md

File metadata and controls

71 lines (45 loc) · 3.13 KB
Raw
layout title permalink tags contributors last_updated_by date
sidebar
Themes
/documentation/themes/
themes
caitmuenster
caitmuenster
2021-04-02

{% capture page_hero_banner_content %}

Enable creative expression with themes

You can use themes to customize how your browser looks by adding images and adjusting the color of various components.

{% endcapture %} {% include modules/overview-page-hero.liquid, content: page_hero_banner_content background: "develop-overview-hero-bg.jpg" %}

{% capture content %}

With themes, you can customize the look of your Firefox by adding images to the header part of the section and changing the colors of the tab strip, address bar, toolbars, and other supported areas.

These themes use the WebExtensions API, the technology used to modify or enhance the capability of Firefox. You can choose to create a static theme, which don't change after installation, or a dynamic theme if you would like to bundle your theme in an extension or programmatically control changes to theme.

Not a coder? Not a problem! It's easy to create a static theme using the AMO theme generator or Firefox Color.

{% endcapture %} {% include modules/one-column.liquid, id: "creating-themes" content: content %}

{% capture content %}

How to create themes

There are four ways you can create themes:

  • Use the AMO theme generator: Use the theme wizard on addons.mozilla.org (AMO) to create themes that are hosted on AMO or that you distribute yourself.

  • Use Firefox Color: Create on-the-fly themes in Firefox. You can generate a URL to share the theme or export the theme as an add-on package.

  • Code a theme yourself: Take advantage of all the theme features available. For instance, add color to more UI components, or utilize the ability to use multiple images. You can then choose to host these themes on AMO or distribute them yourself.

  • Include themes in your extension: Use the theme API in an extension. You can activate these themes based on user requests or dynamic information, like the time of day or the webpage the user is viewing.

Themes

{% endcapture %} {% include modules/one-column.liquid, id: "creating-themes" content: content %}