wp-admin-scheme-oklch
v0.1.0
Published
WordPress admin color scheme expressed as CSS variables using OKLCH values.
Readme
wp-admin-scheme-oklch
WordPress admin color scheme expressed as CSS variables using OKLCH values. Allows custom colors to the WP Admin Bar (Toolbar) and Admin Menu.
We use OKLCH since it allows subtle transformations, similar to how native WordPress color schemes use SCSS color functions.
Install
npm install wp-admin-scheme-oklchUsage
Import the admin.css file. Then, define the css variables, scoped to #wpadminbar and #adminmenumain.
@import '~wp-admin-scheme-scss';
#wpadminbar,
#adminmenumain {
--base-color: var(--color-secondary-950);
--icon-color: var(--color-neutral-300);
--highlight-color: var(--color-primary-500);
--notification-color: var(--color-amber-400);
--menu-bubble-text: var(--base-color);
}
Note: OKLCH values are expected, since other css variables inherit these and some make adjustments. It's possible to use other color formats (e.g. hex), but all variables would need to be defined.
License
ISC
