Enviro-Shade

5.0(

1 rating

)

Extension Developer Tools7 users

Item media 3 (screenshot) for Enviro-Shade

Item media 1 (screenshot) for Enviro-Shade

Item media 2 (screenshot) for Enviro-Shade

Overview

Adds a customizable color banner and watermark to websites to clearly identify your environment (e.g., PROD, QA, LOCAL).

## Never Confuse Production and Development Again **Enviro-Shade** saves web developers from the horror of accidentally creating records, modifying data, or making changes on a client's live production site instead of their local development environment. ### 🎯 Essential for Multi-Tab Workflows - **Instant Visual Recognition**: Color-coded banners and diagonal watermarks make it impossible to mistake which environment you're working in - **Side-by-Side Comparisons**: Easily distinguish prod vs dev when comparing pages across multiple tabs - **No More URL Checking**: Stop squinting at address bars - know your environment at a glance - **Toolbar Badges**: Quick environment identification without switching tabs ### ⚙️ Tailored for Your Workflow - **Smart Severity Levels**: Subtle for localhost, eye-catching for production environments - **Custom URL Patterns**: Match any domain structure with powerful glob support - **Team-Friendly**: Configure labels and colors to match your organization's conventions - **One-Click Setup**: Create rules directly from currently open tabs ### 🔒 Privacy First Runs entirely locally. No data collection, no external servers. Optional browser sync keeps your rules available across devices. **Essential for web developers, QA teams, and anyone juggling multiple environments daily.**

5 out of 5
1 rating
Learn more about results and reviews.

Details

Version
1.4.6
Updated
September 29, 2025
Flag concern
Offered by
N. Koeppe
Size
63.03KiB
Languages
English
Developer
Email
nicolaskoeppe12@gmail.com
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

Enviro-Shade has disclosed the following information regarding the collection and usage of your data. More detailed information can be found in the developer's privacy policy.

Enviro-Shade handles the following:

Website content

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

Snable: UI Inspector & CSS Scanner

4.6

Analyze any web page that catches your eye! Get a detailed overview of colors, fonts, and visual elements for design inspiration.

Environment Indicator

4.3

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

GET WEB SITE THEME COLOR

3.4

Extract the theme colors from the current website and easily check their usage ratio and color codes.

AWS Colorful Navbar

5.0

Identify AWS regions instantly with colorful navbar gradients and country flags.

gridtabs - Spreadsheet Speed Dial

5.0

Organize bookmarks like a spreadsheet: drag URLs from anywhere, and arrange in a customizable grid with color coding.

Design Token Extractor

5.0

Extract design system tokens (colors, spacing, typography) from any website

Salesforce Org Banner

5.0

Adds a customizable banner with a label to the top of Salesforce pages, enhancing navigation and organization.

Know Your Environment

5.0

Manage and customize environment indicators for your websites.

Tealium Tools

4.3

Evaluate website data, tags, and events with powerful tools for seamless Tealium iQ integration and server-side enrichments.

Hex code picker

5.0

Use Hex code picker to grab hex color codes from any webpage. Quickly identify colors and copy hex codes for all your design needs!

Environment Marker

5.0

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