Kibanaは便利だが、Kibanaがここまで流行ったのは、その抜群に格好良い配色も一因ではないか。 あのダークな背景にビビッドな色使いのグラフは、眺めているだけでも何かわかったような気分にさせる。
Kibanaの配色を学ぶために、Kibanaで使われている主要な色を、抜き出して一覧にしてみた。 カラーコードも掲載しているので、Webデザインの配色の参考になればうれしい。
| 背景 | #323232 | |
| パネル | #1f1f1f | |
| ボタン | #9ea09f | |
| テキストボックス | #4d4d4d | |
| 選択・リンク | #33b5e5 | |
| テーマカラー(青) | #48bee6 | |
| テーマカラー(橙) | #fd931a | |
| テーマカラー(緑) | #78b600 | |
| Ok | #699e00 | |
| Cancel | #cc0001 | |
| グラフカラー01 | #7eb26d | |
| グラフカラー02 | #eab839 | |
| グラフカラー03 | #6ed0e0 | |
| グラフカラー04 | #ef843c | |
| グラフカラー05 | #e24d42 | |
| グラフカラー06 | #1f78c1 | |
| グラフカラー07 | #ba43a9 | |
| グラフカラー08 | #705da0 | |
| グラフカラー09 | #508642 | |
| グラフカラー10 | #333333 | |
| グラフカラー11 | #447ebc | |
| グラフカラー12 | #c15c17 | |
| グラフカラー13 | #890f02 | |
| グラフカラー14 | #0a437c | |
| グラフカラー15 | #6d1f62 | |
| グラフカラー16 | #584477 | |
| グラフカラー17 | #b7dbab | |
| グラフカラー18 | #f4d598 | |
| グラフカラー19 | #70dbed | |
| グラフカラー20 | #f9ba8f | |
| グラフカラー21 | #f29191 | |
| グラフカラー22 | #82b5d8 | |
| グラフカラー23 | #e5a8e2 | |
| グラフカラー24 | #aea2e0 | |
| グラフカラー25 | #629e51 | |
| グラフカラー26 | #e5ac0e | |
| グラフカラー27 | #64b0c8 | |
| グラフカラー28 | #e0752d | |
| グラフカラー29 | #bf1b00 | |
| グラフカラー30 | #0a50a1 | |
| グラフカラー31 | #962d82 | |
| グラフカラー32 | #614d93 | |
| グラフカラー33 | #9ac48a | |
| グラフカラー34 | #f2c96d | |
| グラフカラー35 | #65c5db | |
| グラフカラー36 | #f9934e | |
| グラフカラー37 | #ea6460 | |
| グラフカラー38 | #5195ce | |
| グラフカラー39 | #d683ce | |
| グラフカラー40 | #806eb7 | |
| グラフカラー41 | #3f6833 | |
| グラフカラー42 | #967302 | |
| グラフカラー43 | #2f575e | |
| グラフカラー44 | #99440a | |
| グラフカラー45 | #58140c | |
| グラフカラー46 | #052b51 | |
| グラフカラー47 | #511749 | |
| グラフカラー48 | #3f2b5b | |
| グラフカラー49 | #e0f9d7 | |
| グラフカラー50 | #fceaca | |
| グラフカラー51 | #cffaff | |
| グラフカラー52 | #f9e2d2 | |
| グラフカラー53 | #fce2de | |
| グラフカラー54 | #badff4 | |
| グラフカラー55 | #f9d9f9 | |
| グラフカラー56 | #dedaf7 |
