Sublime text 3 での白色背景のcolor scheme(カラースキーマ)


# 投稿した経緯
最近AtomからSublime textに変更しました。
ものすごく軽くて、設定もしやすいです。
乗り換えて大正解です！！

しかし、エンジニアの愛好家が多いためか、カラースキーマが黒色背景のものが多い。
黒のものをそのまま背景を白にしたためか、見えにくいものが多い。

ちなみに私はwebデザイナーです。
私が白色背景のエディターにこだわるのには、理由があります。

- webサイトって、基本白じゃん。白と黒を交互に見たらチカチカしないの？
- Color Highlighter を使ってコードに色をつけると、とにかくわかりづらい。
- Vimとの混乱を避けたい。
- 初めて使ったエディターが白背景だったため。（私はEmacsだった。)
- 黒より白の方が可愛いし、簡単そうに見えるじゃん！

しかし、黒色背景エディターの方が「エンジニアっぽい」「カッコいい！！」との理由で
圧倒的に多数派なんですよね...

なので白色背景エディター派の記事が全く無く、探すのが大変でした。
ここでは、私が見つけた白色背景エディターについてまとめました。

# color scheme 一覧
()の中はパッケージ名です。
点数はあくまでも私の自己判断です。

## Sixteen (default)
![スクリーンショット 2018-04-03 10.57.47.png](https://qiita-image-store.s3.amazonaws.com/0/225361/83033ce2-4fa0-e5b2-ccc9-b07d2f90af1b.png)

見やすさ　☆☆
キュート感   ☆☆☆☆
仕事感   ☆☆☆

黄緑が若干見えづらい。


## Breakers (default)
![スクリーンショット 2018-04-03 11.14.29.png](https://qiita-image-store.s3.amazonaws.com/0/225361/6e5d0892-5232-4231-b2ed-1046868402f9.png)

見やすさ　☆
キュート感   ☆☆☆
仕事感　 ☆

文字がちょっと薄いかな。

## MarkDownLight (MarkDownLight)
![スクリーンショット 2018-04-03 10.59.13.png](https://qiita-image-store.s3.amazonaws.com/0/225361/f366e8b7-ccbb-9c25-0546-29678f61f0b5.png)

見やすさ　☆☆☆☆☆
キュート感 ☆
仕事感　 ☆☆☆

MarkDownの為に作られたテーマ。見やすくてシンプルです。

## ayu-light (ayu)
 ![スクリーンショット 2018-04-03 10.59.39.png](https://qiita-image-store.s3.amazonaws.com/0/225361/7b65059e-be14-9da0-d749-990e478c8908.png)

見やすさ　☆
キュート感 ☆☆☆☆
仕事感　 ☆

有名なayuさんのテーマ。可愛い


## Material-Theme-Lighter (Material Theme)
 ![スクリーンショット 2018-04-03 11.00.47.png](https://qiita-image-store.s3.amazonaws.com/0/225361/f14b62ee-4ddb-7ad2-aa48-2ef91b53bea9.png)

見やすさ　☆
キュート感 ☆☆☆☆☆
仕事感　 ☆

Materialデザイン感満載であるが...黒色背景だと見やすそう！

## Eazy light (Eazy Light)

![スクリーンショット 2018-04-03 11.01.50.png](https://qiita-image-store.s3.amazonaws.com/0/225361/1db10276-4d47-2ae2-0d14-868a19c03dd0.png)

見やすさ　☆☆☆☆
キュート感 ☆☆☆
仕事感　 ☆☆☆

カッコいい系のデザイン。
見やすいコメント枠を求める人に良いかも。

## Agola White (Agola)
![スクリーンショット 2018-04-03 11.12.55.png](https://qiita-image-store.s3.amazonaws.com/0/225361/750c7815-4db2-6dba-c872-c38478163365.png)

見やすさ　☆☆☆
キュート感 ☆☆
仕事感　 ☆☆☆

子供っぽいのは嫌だ！と考えている人におすすめ

## Agola Light (Agola)
![スクリーンショット 2018-04-03 11.13.45.png](https://qiita-image-store.s3.amazonaws.com/0/225361/f9a5fa3a-d942-45ff-676a-dffca8451db8.png)

見やすさ　☆☆☆☆
キュート感 ☆☆
仕事感　 ☆☆

エディターに統一感を求める人にとっては良いかも。

## base16-unikitty-light (base16)
![スクリーンショット 2018-04-03 11.02.25.png](https://qiita-image-store.s3.amazonaws.com/0/225361/f8c72180-ac7d-adcf-1721-4f76e11551ea.png)

見やすさ　☆☆☆☆
キュート感 ☆☆☆☆
仕事感　 ☆☆☆

こういう濃いピンクが好きな女子いるよね。
 
## base16-summerfruit-light (base16)
![スクリーンショット 2018-04-03 11.07.31.png](https://qiita-image-store.s3.amazonaws.com/0/225361/10c709c3-8574-67b6-cc67-e3a105f7a916.png)

見やすさ　☆☆
キュート感 ☆☆☆☆☆
仕事感　 ☆☆☆

文章が水色なのが特徴。
プログラミング系には向いている？

## base16-shapeshifter (base16)
![スクリーンショット 2018-04-03 11.04.17.png](https://qiita-image-store.s3.amazonaws.com/0/225361/73e4fd6b-ebaa-8df2-1451-814f72d3d1bc.png)

見やすさ　☆☆
キュート感 ☆☆☆
仕事感　 ☆☆☆☆

蛍光緑が特徴的。

## base16-one-light (base16)
![スクリーンショット 2018-04-03 11.05.07.png](https://qiita-image-store.s3.amazonaws.com/0/225361/eea66e14-7105-475b-2157-3917e2dbbc45.png)

見やすさ　☆☆☆
キュート感 ☆☆☆
仕事感　 ☆☆☆☆

シンプルなテーマ。MarkDownLight よりも優しい色合い。


## base16-mexco-light (base16)
![スクリーンショット 2018-04-03 11.08.26.png](https://qiita-image-store.s3.amazonaws.com/0/225361/1316e2e1-bca8-d090-0a40-34c73949508d.png)

見やすさ　☆☆☆
キュート感 ☆☆☆☆
仕事感　 ☆☆☆☆

背景が真っ白なので、base16-one-lightよりも見やすい。


## base16-material-lighter (base16)
![スクリーンショット 2018-04-03 11.08.56.png](https://qiita-image-store.s3.amazonaws.com/0/225361/359d9615-3a40-d55a-8d53-df72f31c9110.png)

見やすさ　☆☆☆☆
キュート感 ☆☆☆☆
仕事感　 ☆☆☆

珍しい青色エディター。
 
## base16-google-light (base16)
![スクリーンショット 2018-04-03 11.09.41.png](https://qiita-image-store.s3.amazonaws.com/0/225361/857253c6-2556-eeed-b3ff-df6ac63b944c.png)

見やすさ　☆☆☆☆☆
キュート感 ☆☆☆
仕事感　 ☆☆☆☆☆

何より見やすい。緑がかなり濃い。コーダーに慣れた色合い。

## base16-classic-light (base16)
![スクリーンショット 2018-04-03 11.10.17.png](https://qiita-image-store.s3.amazonaws.com/0/225361/46e30935-53fc-35bc-c4bf-d2cff6ccc491.png)

見やすさ　☆☆
キュート感 ☆☆
仕事感　 ☆☆☆

全体的にちょっと暗めにしたい人向け

## base16-atelier-sulphurpool-light (base16)
![スクリーンショット 2018-04-03 11.11.14.png](https://qiita-image-store.s3.amazonaws.com/0/225361/4c1d6099-9409-0e51-994d-6cf3e81176a9.png)

見やすさ　☆☆
キュート感 ☆☆☆☆
仕事感　 ☆☆

背景が青色。文字が多めになると、見えづらくなるかも。

## base16-atelier-seaside-light (base16)
![スクリーンショット 2018-04-03 11.11.53.png](https://qiita-image-store.s3.amazonaws.com/0/225361/1b9904c4-62b1-e284-852e-d39ab2863c12.png)

見やすさ　☆☆
キュート感 ☆☆☆☆
仕事感　 ☆☆

背景が緑色。文字が緑のところは見づらいかも。

# テーマを探すなら
https://packagecontrol.io/browse/labels/color%20scheme
ここでテーマが人気順で見れます。
スクリーンショットが載っているのも多いので、探してみると良いと思います。

# 今回のSetting内容（一部）
preference->settingで編集できます。
見た目の部分のみにピックアップしました。
文字が見えにくい場合は、こちらの設定を見直すと良いと思います。

```
{
	"theme": "ayu-light.sublime-theme",
	"font_size": 18,
	"font_face": "Ricty Diminished"
	"tab_size": 2,
  	"line_padding_bottom": 2,
	"line_padding_top": 2,
  	"margin": 0
}
```

# 最後に
間違いがあれば、教えていただけるとありがたいです。
もしお気に入りの白色背景カラースキーマがあれば、共有してください！