Environment Indicator

Environment Indicator

Instantly identify the environment of your web applications with customizable visual banners.

🎯 Key Features

• Customizable banners: Create display rules based on regular expressions (regex) to automatically detect your environments (DEV, TEST, PREPROD, PROD, etc.)
• Flexible positioning: Choose from 6 display positions:
  • Horizontal banner at the top or bottom of the page
  • Diagonal ribbons in each of the 4 screen corners
• Adjustable size: 3 sizes available (small, medium, large) to suit your needs, plus a custom mode to define your own height and font size with a live preview
• Custom colors: Assign a unique color to each environment with automatic text contrast for optimal readability. You can also choose your own colors to override this behaviour.
• Intuitive configuration: A simple and modern interface to create, edit, and delete your rules easily
• Import/Export: Import and export your rules to back them up or share them with others
• Multi-language support: Available in French, English, Spanish, Brazilian Portuguese, and German
• Light/Dark mode: Supports both light and dark themes for better comfort and integration with your browser

• Prevent mistakes by visually distinguishing your environments
• Quickly identify which environment you are working on (development, testing, production)
• Avoid critical actions on sensitive environments
• Improve productivity for technical teams

• Click on the extension icon or open the options page
• Add a rule with:
  • A regex to detect the URL (e.g. .dev., .localhost., .prod.example.com.)
  • A descriptive label (e.g. DEV, PROD)
  • A distinctive color
  • A position and a size

🔒 Privacy

• No data is collected or transmitted
• All configurations are stored locally in your browser

• storage: To save your configuration rules locally