Prettifies the AWS navbar where the role, account, and region are located. Click Raw to install on script managers like GreaseMonkey and Tampermonkey.

prettify_aws_profile.user.js

// ==UserScript==
// @author    Mert Acar
// @name      Make AWS Profile and Region Clearer
// @version   2
// @include   https://*.aws.amazon.com/*
// @icon      https://aws.amazon.com/favicon.ico
// @updateURL https://gist.github.com/M4C4R/4ee2797f37f5fbb8f814afaf549e6a5b/raw/b33b6619cf693cc6315b58cd66408d2db7c8b33a/prettify_aws_profile.user.js
// ==/UserScript==

// *** START Configuration ***
const fontSize = '17px';

const safeUserNames = ['view'];
const dangerousUserNames = ['admin'];

const safeEnvironmentTerms = ['test-', '-test-', 'test'];
const dangerousEnvironmentTerms = ['prod-', '-prod-', 'global'];

const safeRegions = ['eu-west-1'];
const dangerousRegions = ['ap-east-1', 'ap-south-1', 'ap-northeast-1', 'ap-northeast-2', 'ap-southeast-1', 'ap-southeast-2'];

const safeColour = "lime";
const cautiousColour = "#ffb600";
const dangerousColour = "red";
// *** END Configuration ***

// *** START Helper functions ***
function getIAMUserNameColour(userName) {
    const loweredUserName = userName.toLowerCase();
    if (dangerousUserNames.includes(loweredUserName)) {
        return dangerousColour;
    } else if (safeUserNames.includes(loweredUserName)) {
        return safeColour;
    } else {
        return cautiousColour;
    }
}

function getRegionColour(region) {
    const loweredRegion = region.toLowerCase();

    if (dangerousRegions.includes(loweredRegion)) {
        return dangerousColour;
    } else if (safeRegions.includes(loweredRegion)) {
        return safeColour;
    } else {
        return cautiousColour;
    }
}

function getEnvironmentColour(environment) {
    const loweredEnvironment = environment.toLowerCase();

    if (doesElementAppearInString(loweredEnvironment, safeEnvironmentTerms)) {
        return safeColour;
    } else if (doesElementAppearInString(loweredEnvironment, dangerousEnvironmentTerms)) {
        return dangerousColour;
    }
    return cautiousColour
}

function doesElementAppearInString(string, container) {
    for (var i = 0; i < container.length; ++i) {
        if (string.includes(container[i])) {
            return true;
        }
    }
    return false;
}

function isUsingNewUI() {
    return document.getElementById('nav-shortcutMenu') == null;
}
// *** END Helper functions ***

// -------------- Script Itself --------------

// Gather the containers for the profile and region
var profileElement;
var regionElement;

if (isUsingNewUI()) {
    profileElement = document.querySelector('#nav-usernameMenu > span:nth-child(1) > span:nth-child(1)');
    regionElement = document.querySelector('#awsc-navigation__more-menu--list > li:nth-child(2) button > span:nth-child(1)');
} else {
    profileElement = document.querySelector('#nav-usernameMenu > .nav-elt-label');
    regionElement = document.querySelector('#nav-regionMenu > .nav-elt-label');
}

// Extend the container of the profile to not cut the text off
profileElement.style["max-width"] = "2000px";
profileElement.style["height"] = "auto";

// Get the profile, IAM user name, environment, and region
const profile = profileElement.textContent;
const environment = profile.split('@').pop().trim();
const iamUserName = ((profile.includes('/')) ? (profile.split('/')) : profile.split('@'))[0].trim();
const region = document.getElementById('awsc-mezz-region').content;

// Update the profile
const iamUserNameHTML = '<font color="' + getIAMUserNameColour(iamUserName) + '">' + iamUserName + '</font>';
const environmentHTML = '<font color="' + getEnvironmentColour(environment) + '">' + environment + '</font>';
profileElement.innerHTML = '<strong style="font-size: ' + fontSize + ';">' + iamUserNameHTML + ' @ ' + environmentHTML + '</strong>';

// Update the region
if (isUsingNewUI()) {
    if (regionElement.textContent.split('(').length = 1){
        regionElement.textContent += ' (Global)';
    }
    regionElement.innerHTML = '<strong style="font-size: ' + fontSize + ';"><font color="' + getRegionColour(region) + '">' + region + ' (' + regionElement.textContent.split('(')[1] + '</font></strong>';
} else {
    regionElement.innerHTML = '<strong style="font-size: ' + fontSize + ';"><font color="' + getRegionColour(region) + '">' + region + ' (' + regionElement.textContent + ')</font></strong>';
}

Examples:

V2: Updated the script to work with the new UI released by AWS in some accounts.