WordPress の管理画面の色は、ユーザーごとに「プロフィール」画面の「管理画面の配色」から切り替えられます。この記事では、標準の配色を変える手順、配色がどこに保存されるか、新しいユーザーの初期配色をそろえる方法、全員の配色を固定して選択欄を隠す方法、本番とステージングで配色を分けて取り違えを防ぐ使い方までを説明します。独自の配色を一から作る方法は最後に概要だけ触れます。
画面の表記や用意されている配色の種類は WordPress のバージョンで変わることがあります。本文は（2026年10月現在）の一般的な日本語表示を基準にしています。
標準の配色を変更する手順
- 管理画面の左メニューから「ユーザー」→「プロフィール」を開きます。右上の自分の名前から「プロフィール」を選んでも同じ画面です。
- 「個人設定」の中にある「管理画面の配色」を探します。
- 色見本の付いた選択肢から好みのものを選びます。選んだ時点で画面の色がその場で切り替わり、見た目を確かめられます。
- ページ下部の「プロフィールを更新」を押して保存します。
保存しないままほかのページへ移ると、元の配色に戻ります。選択肢には「デフォルト」のほか、「ライト」「モダン」「ブルー」「コーヒー」「エクトプラズム」「ミッドナイト」「オーシャン」「サンライズ」などが用意されています。
配色が影響する範囲
配色で変わるのは、主に左のメニュー、上部のツールバー（管理バー）、ボタンやリンクの強調色です。ブロックエディターでも、ボタンなどの一部にこの強調色が使われます。公開ページの見た目には影響しません。
ただし、プラグインが独自に作った設定画面は、配色に合わせて作られていないことがあります。暗い配色にしたら一部の文字が読みにくくなった、という場合は、そのプラグインの画面だけ配色に追従していない可能性があります。
見やすさの観点
「ライト」は背景が明るく、文字との差がはっきりしているため、長時間作業する人や画面の暗さが気になる人に向きます。色の好みだけでなく、メニューの文字が読みやすいか、現在のメニューがどれか分かりやすいかで選ぶと、作業の効率に直結します。
配色は「ユーザーごと」に保存される
配色はサイト全体の設定ではなく、ユーザーごとの設定です。ユーザーのメタ情報（wp_usermeta テーブル）に admin_color というキーで保存されます。自分が配色を変えても、ほかの管理者や編集者の画面は変わりません。
保存される値は配色ごとの識別名で、「デフォルト」は fresh、ほかは light・modern・blue・coffee・ectoplasm・midnight・ocean・sunrise です。
WP-CLI が使える環境では、コマンドで特定ユーザーの配色を変えられます。
# ユーザーID 1 の配色を「ミッドナイト」にする
wp user meta update 1 admin_color midnight
# 現在の値を確認する
wp user meta get 1 admin_color本番とステージングで配色を分ける
実用的な使い方のひとつが、環境ごとに配色を変えて「いまどのサイトを操作しているか」をひと目で分かるようにすることです。本番とステージングの管理画面は見た目がまったく同じなので、別タブで開いていると、本番のつもりでテスト操作をしてしまう、あるいはその逆が起こりがちです。
ステージングの管理画面だけを目立つ配色（たとえば「サンライズ」）にしておくと、取り違えに気づきやすくなります。ステージングを本番から複製した直後は、ユーザー情報も本番と同じになっているため、複製のたびに配色を設定し直すか、次の節のコードでステージング側だけ配色を固定します。
コードで初期値をそろえる・固定する
ここからはコードを使う方法です。管理画面の配色はテーマではなく管理画面全体に関わるので、テーマを変えても残るように、wp-content/mu-plugins/ に置くプラグインとして書くのがおすすめです（子テーマの functions.php でも動きます）。編集前にバックアップを取り、ステージング環境で動作を確認してから本番に入れてください。
新しく登録したユーザーの初期配色を決める
<?php
/**
* 新規ユーザーの管理画面の配色を「モダン」にする。
* 本人は登録後にプロフィール画面で自由に変更できる。
*/
add_action( 'user_register', function ( $user_id ) {
update_user_meta( $user_id, 'admin_color', 'modern' );
} );既存のユーザーには影響しません。既存ユーザーもそろえたい場合は、前の節の WP-CLI コマンドをユーザーごとに実行します。
全員の配色を固定し、選択欄を隠す
社内向けのサイトで画面の見た目を統一したい場合や、ステージング側だけ配色を固定したい場合の例です。
<?php
/**
* 全ユーザーの管理画面の配色を「サンライズ」に固定し、
* プロフィール画面の配色の選択欄を表示しない。
*/
add_filter( 'get_user_option_admin_color', function () {
return 'sunrise';
} );
add_action( 'admin_init', function () {
remove_action( 'admin_color_scheme_picker', 'admin_color_scheme_picker' );
} );get_user_option_admin_color は、ユーザーの admin_color 設定を読み出すときに通るフィルターで、ここで値を返すと保存された値に関係なくその配色になります。選択欄の表示は admin_color_scheme_picker というアクションにコアの関数がつながっているので、それを外しています。コアがこのアクションを登録するのは管理画面の読み込み時なので、admin_init のタイミングで外しています。
ステージングだけで使う場合は、このファイルをステージングにだけ置くか、wp_get_environment_type() が 'staging' を返すときだけ動くように条件を付けます。環境の種類は wp-config.php の WP_ENVIRONMENT_TYPE 定数で指定できます。
<?php
// ステージング環境のときだけ配色を固定する
if ( 'staging' === wp_get_environment_type() ) {
add_filter( 'get_user_option_admin_color', function () {
return 'sunrise';
} );
}独自の配色を追加する（概要）
会社のブランドカラーに合わせたい場合は、wp_admin_css_color() 関数で独自の配色を登録できます。
<?php
add_action( 'admin_init', function () {
wp_admin_css_color(
'my-brand', // 識別名
'ブランド', // 選択欄に出る名前
plugins_url( 'my-brand/colors.css', __FILE__ ), // 配色用CSSのURL
array( '#1d2327', '#2c3338', '#0a7d5a', '#3ec28f' ), // 色見本に出す色
array( 'base' => '#a7aaad', 'focus' => '#ffffff', 'current' => '#ffffff' ) // メニューアイコンの色
);
} );関数で登録するのは「名前」と「CSSファイルの場所」と「色見本」だけで、実際に色を変えるのは指定したCSSファイルです。管理画面のメニュー、ボタン、フォーカス表示などを一通り塗り分ける必要があるため、CSSは小さくありません。一般的には、WordPress のソースに含まれる配色用の Sass ファイル（wp-admin/css/colors/ 配下）を元に、色の変数だけを変えてCSSを生成する方法がとられます。手作業で作る場合は、フォーカス表示や現在のメニューの強調が消えていないか、文字と背景の色の差が十分かを確認してください。
色を作る手間をかけたくない場合は、WordPress.org の公式プラグインディレクトリで配色を追加するプラグインを探す方法もあります。導入する前に、最終更新日と現在の WordPress への対応状況を確認してください。
まとめ
- 配色は「ユーザー」→「プロフィール」の「管理画面の配色」で選び、「プロフィールを更新」で保存します。
- 設定はユーザーごとで、
wp_usermetaのadmin_colorに保存されます。WP-CLI でも変更できます。 - 本番とステージングで配色を分けると、操作するサイトの取り違えを防げます。
- 新規ユーザーの初期値は
user_register、全員の固定はget_user_option_admin_colorフィルター、選択欄の非表示はadmin_color_scheme_pickerアクションの解除で行います。 - 独自の配色は
wp_admin_css_color()で登録できますが、色を塗り分けるCSSを用意する必要があります。