WordPressで記事を編集する場合、カラーパレットを使ってテキストと背景の色を変更できます。このカラーパレットに並んでいるカラーは、使ってるテーマによって異なるということを最近知りました。
現在こちらのサイトで使っているCocoonの場合、初期状態で25色が並んでいます。
パレットの下に並ぶ6個の白丸は、好みの色を6色追加できるための予備になっています。
このカラーコードを抜き出してみました。
Cocoon標準カラーパレットのカラーコード
| テキストクラス名 | 背景色クラス名 | カラーコード | サンプル |
|---|---|---|---|
| has-red-color | has-redbackground-color | #e60033 | ■ |
| has-pink-color | has-pinkbackground-color | #e95295 | ■ |
| has-purple-color | has-purplebackground-color | #884898 | ■ |
| has-indigo-color | has-indigobackground-color | #1e50a2 | ■ |
| has-blue-color | has-bluebackground-color | #0095d9 | ■ |
| has-light-blue-color | has-light-bluebackground-color | #2ca9e1 | ■ |
| has-cyan-color | has-cyanbackground-color | #00a3af | ■ |
| has-teal-color | has-tealbackground-color | #007b43 | ■ |
| has-green-color | has-greenbackground-color | #3eb370 | ■ |
| has-light-green-color | has-light-greenbackground-color | #8bc34a | ■ |
| has-lime-color | has-limebackground-color | #c3d825 | ■ |
| has-yellow-color | has-yellowbackground-color | #ffd900 | ■ |
| has-amber-color | has-amberbackground-color | #ffc107 | ■ |
| has-orange-color | has-orangebackground-color | #f39800 | ■ |
| has-deep-orange-color | has-deep-orangebackground-color | #ea5506 | ■ |
| has-brown-color | has-brownbackground-color | #954e2a | ■ |
| has-grey-color | has-greybackground-color | #949495 | ■ |
| has-watery-blue-color | has-watery-bluebackground-color | #f3fafe | ■ |
| has-watery-yellow-color | has-watery-yellowbackground-color | #fff7cc | ■ |
| has-watery-red-color | has-watery-redbackground-color | #fdf2f2 | ■ |
| has-watery-green-color | has-watery-greenbackground-color | #ebf8f4 | ■ |
大評判の配色アイデアBOOK♪
リンク
