Item logo image for Website color coding

Website color coding

5.0(

1 rating

)
Item media 1 (screenshot) for Website color coding
Item media 2 (screenshot) for Website color coding

Overview

Helps to identify which environment you are working in.

Need to keep track of what environment you are working in? Then this extension is for you! But how, you ask? Let me explain. Basically, what this extension does is adding some basic HTML elements to your loaded page to help you identify the environment you are working in. But how does it work?! There are two ways that environments are detected: Firstly, by a blanket match of domain names via regular expressions. Going by the default configuration this means that any site you visit that starts with "test." is getting elements added that show you a blue border at the top, and a message at the bottom right saying "Test environment". You can change the matching through the options page. Secondly, you can specifically assign a domain to an environment by selecting it from the popup menu which you can access by clicking the extension's icon in your browser. There are quite some options to modify the way you want to see the visual feedback of the environment you are working in. Colorbars can be set on each direction of your page, and the message telling you what environment you are in can be positioned in any corner or border (and rotated if you like). Oh.. one more nice feature: if a site is detected as being in one of your environments, it will give you a warning if the domain (hostname) will be changed. That will help you with those pesky links on a development site that sneakily directs you to the production site! I hope you find this useful. If you want to contribute, check out my repository at https://github.com/MPaans/chrome-extension-website-color-coding

Details

  • Version
    1.3.2
  • Updated
    July 21, 2026
  • Offered by
    MPaans
  • Size
    36.13KiB
  • Languages
    English
  • Developer
    Email
    marcel@paans.net
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

Manage extensions and learn how they're being used in your organization
The developer has disclosed that it will not collect or use your data.

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Support

Related

Power Bookmarks

5.0

Power Bookmarks allows you to search your bookmarks easily. Its tree view and sunburst view allow you to analyze the complexity of…

Promnesia

5.0

Recall which pages you already visited, why and in which context

Advance Tab Groups

4.3

Auto tab group based on the url or regex

Colorfy

4.1

Change colors of elements on a web page easily.

Development favicon

4.5

Assign colored stripes to favicons, based on URL and title regex matching.

URLColors

4.7

A chrome extension that adds a colored border around websites that match user inputted preferences.

Environment Marker

5.0

Provides a way to add a color indicator or marker (ribbon) on a web page depending on the URL.

URL Marker

5.0

Never mix up your local, test and live environment again! Markers show on pages and tabs. Share your settings with your team.

Environment switcher 2.0

4.0

Switch between multiple site environments quickly and easily.

Stackable - The Tab Sorter

4.3

Sorts all your tabs in one click

Environment Indicator

4.3

Add an environment marker to differentiate QA environments from production. In addition, you can create your own indicator rules

Environment Marker

4.8

Use the Environment Marker extension and prevent screw-ups with the (programming) environments.

Power Bookmarks

5.0

Power Bookmarks allows you to search your bookmarks easily. Its tree view and sunburst view allow you to analyze the complexity of…

Promnesia

5.0

Recall which pages you already visited, why and in which context

Advance Tab Groups

4.3

Auto tab group based on the url or regex

Colorfy

4.1

Change colors of elements on a web page easily.

Development favicon

4.5

Assign colored stripes to favicons, based on URL and title regex matching.

URLColors

4.7

A chrome extension that adds a colored border around websites that match user inputted preferences.

Environment Marker

5.0

Provides a way to add a color indicator or marker (ribbon) on a web page depending on the URL.

URL Marker

5.0

Never mix up your local, test and live environment again! Markers show on pages and tabs. Share your settings with your team.

Google apps