Color module overview

Last updated on
14 September 2022

The Color module allows users with the Administer site configuration permission to quickly and easily change the color scheme of themes that have been built to be compatible with it. In order for the color module to work, a theme must be specifically designed to use the color changing features.

Uses

The Color module allows you to easily change the color of links, backgrounds, text, and other theme elements

Basic configuration

The Color module comes enabled in the Drupal standard profile. You will have to enable the module if you are installing Drupal with the minimal profile.

After enabling the Color module, navigate to your theme's configuration page (Administration > Appearance or http://example.com/admin/appearance) and click "Settings" for your theme. This will display the color picker tool which will allow you to modify the theme's color settings.

To change the color settings for a compatible theme, select the Settings to link for your theme on the Themes administration page. If you don't see a color picker on that page, then your theme is not compatible with the color module. If you are sure that the theme does indeed support the color module, but the color picker does not appear, then follow these troubleshooting procedures. Note: Color hex codes defined on default color scheme and on the css file are case sensitive.

The Color module saves a modified copy of the theme's style.css file in the files directory and includes it after the theme's original style.css. This means that if you make any manual changes to your theme's style.css file, you must save your color settings again, even if they haven't changed. This causes the Color module-generated version of style.css in the files directory to be recreated using the new version of the original file. This step is required because the module stylesheets (in the files directory) need to be recreated to include your changes.

Using the Lock icons

When 2 adjacent colors settings fields have the lock icon between them selected, then changing the color of one will change the color of the other.
But:
- They seem to work for only color fields that are adjacent to the selected color field (click in the field to select it), not with others
- They do not work if the color is set directly through the textbox by entering the hex code
- They work only by using the color picker

More information

Advanced usage with downloads set to Private

Color module requires your file download method to be set to public. If you want to use color.module in conjunction with the "private" download method, then there are a couple of options:

  1. Configure your theme colors on a test site and copy the resulting files (look in the /color folder in the "files" folder) to a named subfolder of the main theme, thus creating a CSS-only theme (see Theming overview).
  2. If the contents of your "files" directory are actually accessible directly via HTTP (which will actually be the case with the "private" download method unless you have either set up the "files" directory outside your web root or added additional directives to the default .htaccess file that Drupal creates in the "files" folder so as to prevent such access) then you may be able to switch to "public" download method temporarily while you configure the color scheme, switching back to "private" afterwards. Be aware that changing the download method will modify all download paths and may cause unexpected problems on an existing site.

Help improve this page

Page status: No known problems

You can: