Skip to content

Instantly share code, notes, and snippets.

@GLWalker

GLWalker/wp-admin-variables.css

Created January 13, 2026 16:29
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save GLWalker/71379f31cc0b4bcabd829dec529d157b to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save GLWalker/71379f31cc0b4bcabd829dec529d157b to your computer and use it in GitHub Desktop.
Download ZIP
WP Admin Color Scheme Vars
Raw
wp-admin-variables.css
/* ======================================
FALLBACK / DEFAULT SCHEME (Fresh)
====================================== */
body {
/* Global */
--sd-body-background: #f1f1f1;
--sd-link: #2271b1;
--sd-link-focus: #135e96;
--sd-button-color: #2271b1;
--sd-highlight-color: #2271b1;
--sd-notification-color: #d63638;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #1d2327;
--sd-menu-text: #fff;
--sd-menu-icon: #f5f7f8;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #1d2327;
--sd-menu-highlight-text: #72aee6;
--sd-menu-highlight-icon: #72aee6;
/* Menu Current (Active Item) */
--sd-menu-current-background: #2271b1;
--sd-menu-current-text: #fff;
--sd-menu-current-icon: #fff;
/* Submenu */
--sd-menu-submenu-background: #2c3339;
--sd-menu-submenu-text: #a2aab2;
--sd-menu-submenu-focus-text: #72aee6;
}
/* ======================================
WORDPRESS CORE SCHEMES
====================================== */
/* Blue */
body.admin-color-blue {
/* Global */
--sd-highlight-color: #096484;
--sd-button-color: #e1a948;
--sd-notification-color: #e1a948;
--sd-link: #0073aa;
--sd-link-focus: #0073aa;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #52accc;
--sd-menu-text: #fff;
--sd-menu-icon: #e5f8ff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #096484;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #4796b3;
--sd-menu-submenu-text: #e2ecf1;
--sd-menu-submenu-focus-text: #fff;
}
/* Coffee */
body.admin-color-coffee {
/* Global */
--sd-highlight-color: #c7a589;
--sd-button-color: #59524c;
--sd-notification-color: #9fa476;
--sd-link: #0073aa;
--sd-link-focus: #c7a589;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #59524c;
--sd-menu-text: #fff;
--sd-menu-icon: #f2f2f2;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #c7a589;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #45403b;
--sd-menu-submenu-text: #cdcbc9;
--sd-menu-submenu-focus-text: #c7a589;
}
/* Ectoplasm */
body.admin-color-ectoplasm {
/* Global */
--sd-highlight-color: #a3b745;
--sd-button-color: #a3b745;
--sd-notification-color: #d46f15;
--sd-link: #0073aa;
--sd-link-focus: #a3b745;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #523f6d;
--sd-menu-text: #fff;
--sd-menu-icon: #ece6f6;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #a3b745;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #403156;
--sd-menu-submenu-text: #cbc5d3;
--sd-menu-submenu-focus-text: #a3b745;
}
/* Light */
body.admin-color-light {
/* Global */
--sd-body-background: #f5f5f5;
--sd-highlight-color: #04a4cc;
--sd-button-color: #04a4cc;
--sd-notification-color: #d64e07;
--sd-link: #0073aa;
--sd-link-focus: #04a4cc;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #e5e5e5;
--sd-menu-text: #333;
--sd-menu-icon: #686868;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #888;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #fff;
--sd-menu-submenu-text: #686868;
--sd-menu-submenu-focus-text: #04a4cc;
}
/* Midnight */
body.admin-color-midnight {
/* Global */
--sd-highlight-color: #e14d43;
--sd-button-color: #363b3f;
--sd-notification-color: #69a8bb;
--sd-link: #0073aa;
--sd-link-focus: #e14d43;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #363b3f;
--sd-menu-text: #fff;
--sd-menu-icon: #f2f2f2;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #e14d43;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #25282b;
--sd-menu-submenu-text: #c3c4c5;
--sd-menu-submenu-focus-text: #e14d43;
}
/* Modern */
body.admin-color-modern {
/* Global */
--sd-highlight-color: #3858e9;
--sd-button-color: #3858e9;
--sd-notification-color: #3858e9;
--sd-link: #3858e9;
--sd-link-focus: #7b90ff;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #1e1e1e;
--sd-menu-text: #fff;
--sd-menu-icon: #f2f2f2;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #3858e9;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #0c0c0c;
--sd-menu-submenu-text: #bbbbbb;
--sd-menu-submenu-focus-text: #7b90ff;
}
/* Ocean */
body.admin-color-ocean {
/* Global */
--sd-highlight-color: #9ebaa0;
--sd-button-color: #738e96;
--sd-notification-color: #aa9d88;
--sd-link: #0073aa;
--sd-link-focus: #9ebaa0;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #738e96;
--sd-menu-text: #fff;
--sd-menu-icon: #f2fcff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #9ebaa0;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #627b83;
--sd-menu-submenu-text: #d5dddf;
--sd-menu-submenu-focus-text: #9ebaa0;
}
/* Sunrise */
body.admin-color-sunrise {
/* Global */
--sd-highlight-color: #dd823b;
--sd-button-color: #dd823b;
--sd-notification-color: #ccaf0b;
--sd-link: #0073aa;
--sd-link-focus: #0073aa;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #cf4944;
--sd-menu-text: #fff;
--sd-menu-icon: #f2f2f2;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #dd823b;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #be3530;
--sd-menu-submenu-text: #f1c8c7;
--sd-menu-submenu-focus-text: #f7e3d3;
}
/* 80s Kid */
body.admin-color-80s-kid {
/* Global */
--sd-highlight-color: #d13674;
--sd-button-color: #d13674;
--sd-notification-color: #28b811;
--sd-link: #0c4da1;
--sd-link-focus: #d13674;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #0c4da1;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #d13674;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #093a7a;
--sd-menu-submenu-text: #c9d8ed;
--sd-menu-submenu-focus-text: #d13674;
}
/* Adderley */
body.admin-color-adderley {
/* Global */
--sd-highlight-color: #1730e5;
--sd-button-color: #1730e5;
--sd-notification-color: #bde7f0;
--sd-link: #1730e5;
--sd-link-focus: #216bce;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #216bce;
--sd-menu-text: #fff;
--sd-menu-icon: #f1f2f3;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #1730e5;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #1c5baf;
--sd-menu-submenu-text: #bcd3f0;
--sd-menu-submenu-focus-text: #bde7f0;
}
/* Aubergine */
body.admin-color-aubergine {
/* Global */
--sd-highlight-color: #c99416;
--sd-button-color: #c99416;
--sd-notification-color: #ba5b32;
--sd-link: #353354;
--sd-link-focus: #ba5b32;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #5c5b73;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #c99416;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #4a495e;
--sd-menu-submenu-text: #d3d2dc;
--sd-menu-submenu-focus-text: #c99416;
}
/* Contrast Blue */
body.admin-color-contrast-blue {
/* Global */
--sd-highlight-color: #22466d;
--sd-button-color: #22466d;
--sd-notification-color: #9d2f4d;
--sd-link: #22466d;
--sd-link-focus: #2e5f94;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #a5cde8;
--sd-menu-text: #151923;
--sd-menu-icon: #151923;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #dae9f3;
--sd-menu-highlight-text: #151923;
--sd-menu-highlight-icon: #151923;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #b5d3e8;
--sd-menu-submenu-text: #151923;
--sd-menu-submenu-focus-text: #151923;
}
body.admin-color-contrast-blue #adminbar {
--sd-menu-submenu-background: #dae9f3;
}
/* Cruise */
body.admin-color-cruise {
/* Global */
--sd-highlight-color: #79b591;
--sd-button-color: #79b591;
--sd-notification-color: #cda200;
--sd-link: #4f56a9;
--sd-link-focus: #36395c;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #36395c;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #79b591;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #292b46;
--sd-menu-submenu-text: #c3c4ce;
--sd-menu-submenu-focus-text: #79b591;
}
/* Flat */
body.admin-color-flat {
/* Global */
--sd-highlight-color: #1abc9c;
--sd-button-color: #1abc9c;
--sd-notification-color: #d35401;
--sd-link: #00806b;
--sd-link-focus: #2c3e50;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #2c3e50;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #1abc9c;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #1f2c39;
--sd-menu-submenu-text: #c0c5cb;
--sd-menu-submenu-focus-text: #1abc9c;
}
/* Kirk */
body.admin-color-kirk {
/* Global */
--sd-highlight-color: #bd3854;
--sd-button-color: #bd3854;
--sd-notification-color: #bd3854;
--sd-link: #cfbbbf;
--sd-link-focus: #bd3854;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #5f1b29;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #bd3854;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #3a2d21;
--sd-menu-submenu-text: #cfbbbf;
--sd-menu-submenu-focus-text: #bd3854;
}
/* Lawn */
body.admin-color-lawn {
/* Global */
--sd-highlight-color: #a7b145;
--sd-button-color: #a7b145;
--sd-notification-color: #456a7f;
--sd-link: #466607;
--sd-link-focus: #a7b145;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #1e2a29;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #a7b145;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #0f1515;
--sd-menu-submenu-text: #bcbfbf;
--sd-menu-submenu-focus-text: #a7b145;
}
/* Modern Evergreen */
body.admin-color-modern-evergreen {
/* Global */
--sd-highlight-color: #11533b;
--sd-button-color: #3855e1;
--sd-notification-color: #1e1e1e;
--sd-link: #3855e1;
--sd-link-focus: #1e3bc8;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #1e8060;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #0f4232;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #17634a;
--sd-menu-submenu-text: #bcd9cf;
--sd-menu-submenu-focus-text: #fff;
}
/* Primary */
body.admin-color-primary {
/* Global */
--sd-highlight-color: #d8b230;
--sd-button-color: #d8b230;
--sd-notification-color: #e46713;
--sd-link: #240e73;
--sd-link-focus: #a84808;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #35395c;
--sd-menu-text: #fff;
--sd-menu-icon: #fff;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #d8b230;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #2a2e4a;
--sd-menu-submenu-text: #caced9;
--sd-menu-submenu-focus-text: #d8b230;
}
/* Seashore */
body.admin-color-seashore {
/* Global */
--sd-body-background: #f8f6f1;
--sd-highlight-color: #456a7f;
--sd-button-color: #456a7f;
--sd-notification-color: #456a7f;
--sd-link: #456a7f;
--sd-link-focus: #533c30;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #e1dbc5;
--sd-menu-text: #533c30;
--sd-menu-icon: #533c30;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #456a7f;
--sd-menu-highlight-text: #f5f4f1;
--sd-menu-highlight-icon: #f5f4f1;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #d5cdad;
--sd-menu-submenu-text: #533c30;
--sd-menu-submenu-focus-text: #456a7f;
}
/* Vineyard */
body.admin-color-vinyard {
/* Global */
--sd-highlight-color: #cc9e14;
--sd-button-color: #cc9e14;
--sd-notification-color: #ba8752;
--sd-link: #7d2f4f;
--sd-link-focus: #9e7806;
/* Admin Menu & Admin Bar Base */
--sd-menu-background: #462b36;
--sd-menu-text: #fff;
--sd-menu-icon: #f3f1f2;
/* Admin Menu Hover (menu-top:hover) */
--sd-menu-highlight-background: #cc9e14;
--sd-menu-highlight-text: #fff;
--sd-menu-highlight-icon: #fff;
/* Menu Current (Active Item) */
--sd-menu-current-background: var(--sd-menu-highlight-background);
--sd-menu-current-text: var(--sd-menu-highlight-text);
--sd-menu-current-icon: var(--sd-menu-highlight-icon);
/* Submenu */
--sd-menu-submenu-background: #301d25;
--sd-menu-submenu-text: #c8bfc3;
--sd-menu-submenu-focus-text: #533c30;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment