Add-ons
To try the thousands of add-ons available here, download Mozilla Firefox, a fast, free way to surf the Web!
CloseWelcome to Firefox Add-ons.
Choose from thousands of extra features and styles to make Firefox your own.
Close
Color Transform 6.0 No Restart
by Peter J. Sloetjes, MSc.
Transform the colors of entire web pages or selected elements. Combine predefined themes with basic transforms. Save transforms for specific web domains.
This add-on is not compatible with your version of Firefox because of the following:
$8.99 suggested
Enjoy this add-on?
The developer of this add-on asks that you help support its continued development by making a small contribution.
About this Add-on
Color Transform has been available since January 2012 and is under active development. This project depends on financial support from end users (you!). The current level of donations is insufficient to pay for maintenance.
NEW in version 6.0:
> More themes with improved contrast.
> White-listing and black-listing of web domains for automatic coloration.
> Compatibility to multi-process Firefox.
> Faster transforms to a single hue.
> Option to not transform background images which are not referenced.
Introduction
Color Transform enables you to adapt the colors of web pages or page elements to your taste or need by combining complete themes and basic transforms, and to save applied transformations for automatic coloration of pages on specific web domains.
The toolbar panel contains four kinds of buttons (all buttons have a descriptive tool tip):
1) At the top, the toolbar panel contains a row of action buttons.
2) The last action button toggles the visibility of the next two rows with round buttons. These are detailed options which may be switched on and off with a click.
3) The next 40 buttons are for applying a predefined color transformation or 'theme' directly to the current page or selected element. The themes are designed so as to obtain readable and predictable results on the majority of web pages.
4) The last 32 buttons are for changing the hue, saturation, lightness and opacity (HSLA) of all colors in the same way. These basic transforms may be used to compose a desired color transformation.
Usage
> To apply a theme or transform to the current page or selected element, simply click one or more of the theme or transform buttons in the toolbar panel.
> To save the color transformation which was applied to the current page or selected element, click the 'star' button to make it the default transform, or the 'plus' button to save it for the current web domain.
> To switch automatic coloration on or off, click the toolbar button.
> To manually apply the saved or default transform to the current page, double-click the toolbar button.
> To select an element on the page in order to transform its colors, click the arrow button.
> To reload the current page without applying a color transformation, click the 'reload' button in the toolbar panel.
> To switch an option on or off, click one of the round buttons in the toolbar panel (those may be hidden). The first option controls automatic coloration, the second option determines whether a white list is used and the third option determines whether domain-specific transforms are used instead of the default transform. The other options apply to the current transformation only, but they are stored with each saved transform.
Tips
> Take some time to read the tool tips on the buttons in the toolbar panel.
> You probably want to exclude background images from the transformation on the new tab page (about:newtab), or to switch it to showing an empty page.
> This extension attempts to use semantic information, but this is of limited use for CSS background images, which are used by authors to present photos, icons, backgrounds, and other art work. You may want to disable the transformation of CSS background images on certain sites, but this will also disable the transformation of actual backgrounds and of large sprite maps from which icons are drawn. No general solution exists for this issue.
> Dark content themes are best combined with dark scroll bars (see the New Scrollbars extension) and/or dark Firefox complete themes (like FT Deepdark).
> You may want to check out my extension Colorific, which provides color-map previews and more accurate control of color properties and transforms.
How it works
Color Transform works by transforming the color data in style sheets, inline styles and images. This is done on the CPU rather than the GPU, which has two advantages: 1) after transformation, pages have higher responsiveness and faster scrolling than in the case where a color transformation is continuously applied to the entire page on the GPU (unless your GPU is fast), and 2) it provides better control over the end result, because different transformations can be used for different style properties. A disadvantage of using the CPU is clearly that it can be slow on certain pages, and that the transformation cannot be undone without reloading the page.
Known issues
> The original page content becomes visible for a short period before an automatic transform is applied, which is annoying for dark themes. Attempts will be made to fix this. Donate now.
> Transformation of pages with lots of large image elements will be slow. Using the option to exclude large image elements is recommended. An option will be added to stop the transformation after a certain data or time limit is reached.
> Automatic coloration does not apply to style sheets which are inserted/modified after the initial page load event. This will not be fixed, because fixing this would make pages very slow.
> In the latest developer and nightly versions, the automatic transformation runs again when a tab is moved out of a window. This will be fixed soon.
> This extension is affected by the following known bugs in Firefox: 700926, 776363, 902636, 958972.
Future
Donate now to enable me to realize the following additional improvements:
> Prevention of flashes of the original page content before automatic coloration is applied, especially for dark themes.
> Addition of an option to stop the transformation after a data or time limit is reached.
> Use of WebGL to speed up the transformation of images (initiated).
> Inclusion of transforms in the RGBA/HSVA/HCLA domains.
> Ability to colorize the Firefox user interface.
NEW in version 6.0:
> More themes with improved contrast.
> White-listing and black-listing of web domains for automatic coloration.
> Compatibility to multi-process Firefox.
> Faster transforms to a single hue.
> Option to not transform background images which are not referenced.
Introduction
Color Transform enables you to adapt the colors of web pages or page elements to your taste or need by combining complete themes and basic transforms, and to save applied transformations for automatic coloration of pages on specific web domains.
The toolbar panel contains four kinds of buttons (all buttons have a descriptive tool tip):
1) At the top, the toolbar panel contains a row of action buttons.
2) The last action button toggles the visibility of the next two rows with round buttons. These are detailed options which may be switched on and off with a click.
3) The next 40 buttons are for applying a predefined color transformation or 'theme' directly to the current page or selected element. The themes are designed so as to obtain readable and predictable results on the majority of web pages.
4) The last 32 buttons are for changing the hue, saturation, lightness and opacity (HSLA) of all colors in the same way. These basic transforms may be used to compose a desired color transformation.
Usage
> To apply a theme or transform to the current page or selected element, simply click one or more of the theme or transform buttons in the toolbar panel.
> To save the color transformation which was applied to the current page or selected element, click the 'star' button to make it the default transform, or the 'plus' button to save it for the current web domain.
> To switch automatic coloration on or off, click the toolbar button.
> To manually apply the saved or default transform to the current page, double-click the toolbar button.
> To select an element on the page in order to transform its colors, click the arrow button.
> To reload the current page without applying a color transformation, click the 'reload' button in the toolbar panel.
> To switch an option on or off, click one of the round buttons in the toolbar panel (those may be hidden). The first option controls automatic coloration, the second option determines whether a white list is used and the third option determines whether domain-specific transforms are used instead of the default transform. The other options apply to the current transformation only, but they are stored with each saved transform.
Tips
> Take some time to read the tool tips on the buttons in the toolbar panel.
> You probably want to exclude background images from the transformation on the new tab page (about:newtab), or to switch it to showing an empty page.
> This extension attempts to use semantic information, but this is of limited use for CSS background images, which are used by authors to present photos, icons, backgrounds, and other art work. You may want to disable the transformation of CSS background images on certain sites, but this will also disable the transformation of actual backgrounds and of large sprite maps from which icons are drawn. No general solution exists for this issue.
> Dark content themes are best combined with dark scroll bars (see the New Scrollbars extension) and/or dark Firefox complete themes (like FT Deepdark).
> You may want to check out my extension Colorific, which provides color-map previews and more accurate control of color properties and transforms.
How it works
Color Transform works by transforming the color data in style sheets, inline styles and images. This is done on the CPU rather than the GPU, which has two advantages: 1) after transformation, pages have higher responsiveness and faster scrolling than in the case where a color transformation is continuously applied to the entire page on the GPU (unless your GPU is fast), and 2) it provides better control over the end result, because different transformations can be used for different style properties. A disadvantage of using the CPU is clearly that it can be slow on certain pages, and that the transformation cannot be undone without reloading the page.
Known issues
> The original page content becomes visible for a short period before an automatic transform is applied, which is annoying for dark themes. Attempts will be made to fix this. Donate now.
> Transformation of pages with lots of large image elements will be slow. Using the option to exclude large image elements is recommended. An option will be added to stop the transformation after a certain data or time limit is reached.
> Automatic coloration does not apply to style sheets which are inserted/modified after the initial page load event. This will not be fixed, because fixing this would make pages very slow.
> In the latest developer and nightly versions, the automatic transformation runs again when a tab is moved out of a window. This will be fixed soon.
> This extension is affected by the following known bugs in Firefox: 700926, 776363, 902636, 958972.
Future
Donate now to enable me to realize the following additional improvements:
> Prevention of flashes of the original page content before automatic coloration is applied, especially for dark themes.
> Addition of an option to stop the transformation after a data or time limit is reached.
> Use of WebGL to speed up the transformation of images (initiated).
> Inclusion of transforms in the RGBA/HSVA/HCLA domains.
> Ability to colorize the Firefox user interface.
