08 12 2012 twitter-bootstrap Tweet
BootstrapのCSSを簡単にいい感じにカスタマイズできる厳選サービス２＋１つ紹介で二つ紹介されてたので、両方触ってみた。
Paintstrap
PaintStrapはAdobe kulerとCOLORloversの配色を取り込んでbootstrapに設定してくれる。
が、kulerがいまいち使えないというか、気に入ったパターンをアプライするとごちゃごちゃした感じになるので「えーこんなの使えねーじゃん」と最初は結構悩んだ。
どういうパターンを選択するのがよいかということになるわけだが、kulerを使った誰にでもできそうなWeb配色を参考にした。というわけで、同系色の濃淡+アクセントカラーというパターンを選ぶとうまくいくことが多いかなと。
natureとかいい感じ
kulerだと7:2.5:0.5とか色の面積比で見ることができないので、面積力がなくてバランスが掴めない場合にはCOLORloversの比率付きで出ているパレットを使ったほうが全体のイメージが掴みやすいかもしれない。それから色で検索できるので個人的にはこっちを使うほうが楽かなと思う。lavish(後述)でつくったセットが気に入らない場合に色で検索できる。
Lavish
写真からbootstrapの配色を決定しくれるサービスなのでお手軽。自分の写真から配色つくれば、オリジナルの写真をherounitにでも設定すれば素敵になるし。
写真もアクセントカラーの効いてるヤツを選ぶといいみたい(こういうのとか)
Flickrで良さげなのをみつけてアプライするのもいいと思う。
ただ、どうしてもボケた感じになってしまうので、似たような配色をCOLORloversで探してみることは多いかも。あとはFlickr使うとオリジナルの写真を貼付けにくいので、自分のPhotostockの中から使うのがいいかな。
配色の管理
つくったlessは自分用twitter bootstrapを管理するでmy_variablesを配色名にちなんだ名前のファイルにしてヘッダーにオリジナルの画像のURLがlavishとかパターンのurlでもつけておけばいいかなと思う。
こんな感じで使ってみようと思う。
ウェブ配色 コーディネートカタログ
