# Accent Color for Admin Buttons and Links

> Changes the blue of primary buttons, links and focus rings across wp-admin to one accent color of your choice.

- Type: SCSS
- Runs: Admin head
- Category: [Admin](https://wpide.com/library/category/admin/)
- Tags: admin, branding, scss
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/admin-accent-color/

## Code

```scss
// Your accent color.
$accent: #6a2fd6;

.wp-core-ui .button-primary {
    background: $accent;
    border-color: $accent;

    &:hover,
    &:focus {
        background: darken($accent, 8%);
        border-color: darken($accent, 8%);
    }
}

.wp-core-ui .button:not(.button-primary) {
    color: $accent;
    border-color: $accent;
}

#wpbody-content a:not(.button):not(.page-title-action) {
    color: $accent;
}

input:focus,
select:focus,
textarea:focus,
.wp-core-ui .button:focus {
    border-color: $accent;
    box-shadow: 0 0 0 1px $accent;
}
```

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Accent Color for Admin Buttons and Links" in its snippet library and add it in one click; or create a new SCSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/
