Website color coding
Item logo image for Website color coding

Website color coding

Featured
5.0(

2 ratings

)
Item media 1 screenshot
Item media 2 screenshot

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

5 out of 52 ratings

Google doesn't verify reviews. Learn more about results and reviews.

Review's profile picture

Marcel PaansDec 20, 2019

This is a life saver when you are a website developer. It helped me several times by warning me when a link in my development environment was about to send me to a production environment. The color coding is also a nice visual clue in what environment you are working.

2 out of 2 found this helpful

Details

  • Version
    1.1.1
  • Updated
    October 13, 2019
  • Offered by
    MPaans
  • Size
    35.9KiB
  • 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

The developer has not provided any information about the collection or usage of your data.

Support

Related

Environment switcher 2.0

3.8(4)

Switch between multiple site environments quickly and easily.

Environment Tagger

5.0(7)

Never delete those production data again!

Website Tagger

0.0(0)

Tag websites on various conditions for easy recognition

Environment Notification Banner

0.0(0)

This extension shows a warning banner on the page when visiting a specified set of URLS

Development favicon

4.3(3)

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

URLColors

4.6(34)

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

Environment Marker

5.0(2)

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

Color Icon

3.7(3)

A Chrome Extension to differentiate tabs with the same Favicon

Webpage Banner

0.0(0)

Adds a banner to a specific URL

Site Labeler

4.8(6)

Utility to add eye catching labels to sites depending on their url. Useful when working with different environments of the same site

Drupal Environment Indicator

4.0(1)

Let you change your admin menu color for every site.

Kappalizer - Web Page Environment Coloring

5.0(4)

Allows to add a color mark to the page depending on environment (devel, staging, production, ...)

Environment switcher 2.0

3.8(4)

Switch between multiple site environments quickly and easily.

Environment Tagger

5.0(7)

Never delete those production data again!

Website Tagger

0.0(0)

Tag websites on various conditions for easy recognition

Environment Notification Banner

0.0(0)

This extension shows a warning banner on the page when visiting a specified set of URLS

Development favicon

4.3(3)

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

URLColors

4.6(34)

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

Environment Marker

5.0(2)

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

Color Icon

3.7(3)

A Chrome Extension to differentiate tabs with the same Favicon

Google apps