Skip to content

The extension reads a specific meta-tag from the HTML head and updates the browser toolbar icon's color, badge text, and tooltip accordingly.

License

Notifications You must be signed in to change notification settings

domidodo/TechStackIdentifier_BrowserExtension

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation



Logo

TechStack Identifier (browser extension)

A lightweight browser extension for Chrome, Edge, and Brave that instantly identifies which environment (e.g., Staging, Production, Dev) you are currently browsing.

The extension reads a specific meta-tag from the HTML head and updates the browser toolbar icon's color, badge text, and tooltip accordingly.

Report Bug · Request Feature

Table of Contents

  1. About The Project
  2. Key features
  3. Built With
  4. Screenshots
  5. Installation
  6. Website Integration
  7. Configuration
  8. Contributing
  9. License

About The Project

When working with multiple environments like Production, Staging, and Development, it’s easy to lose track of which tab represents which instance. The TechStack Identifier solves this by providing immediate visual feedback directly in your browser's toolbar.

Key features

  • Auto-Detection: Scans for <meta name="company:tech"> tags.
  • Profile-Based: Apply consistent colors/labels across multiple domains using profiles.
  • Subdomain Support: Map a root domain once, and all subdomains inherit the settings.
  • Exceptions: Force specific displays for exact URLs.

(back to top)

Built With

  • JavaScript
  • HTML
  • CSS

(back to top)

Screenshots

Highlighting

(back to top)

Installation

FireFox:
https://addons.mozilla.org/en-US/firefox/addon/techstack-identifier/

Google Chrome:
https://chrome.google.com/webstore/detail/techstack-identifier/bppcohfjnmjlengdelbjcepjmeackcnb

(back to top)

Website Integration

To enable detection, add this tag to your website's :

<meta name="company:tech" content="S" />

The extension matches the content value against your defined profiles.

(back to top)

Configuration

The extension is fully customizable via a JSON editor in the settings.

{
  "profiles": {
    "standard": {
      "S": { "label": "Staging", "color": "#1E90FF", "badge": "STG" },
      "P": { "label": "Production", "color": "#FF0000", "badge": "PRD" }
    }
  },
  "domainMapping": {
    "default": "standard",
    "example.com": "standard"
  }
}

(back to top)

Contributing

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE for more information.

(back to top)

About

The extension reads a specific meta-tag from the HTML head and updates the browser toolbar icon's color, badge text, and tooltip accordingly.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published