ニケッチャニッキ

はてなブログ・WordPressカスタマイズ・Androidプログラミング

表示を確認しながらスタイル設定ができるツールCSS Explorer

CSS Explorerは表示を確認しながらスタイルの微調整ができる便利なツールです。

border-radiusとかbox-shadowとか、どのくらいの値にしたらどのくらい変化するのかって最初の頃はイメージしづらいと思うんですが、このツールがあれば余裕です。

CSS Explorerの使い方

画面左のメニューでcssを調整し、右のウィンドウで表示を確認。

cssコードが出力されるのでコピペして使います。

英語のサイトですが、英語がぜんぜんわからなくても感覚的に使えます。

cssの知識がなくても1つ1つ触っていって、このプロパティを付けたらこうなるのか~ってゆう勉強にもなると思います。

linkCSS Explorer

グラデーションの設定はColor Hexというサイトを合わせて使うとキレイに仕上がります。

使いたい色の少し暗めの色をグラデーションに使うといい感じに仕上がる。