Sassで色を調整する - Qiita
sassでベースカラーを元に色の変更を行う関数を忘れがちなのでメモ HSL［色相（Hue）、彩度（Saturation）、輝度（Lightness）］ベース Photoshop等で使用されるHSB(HSV)［色相（Hue）、彩度（Saturation）、明度（Brightness・Value）］ではない HSBで色を変換したいときは「Sassで色空間『HSB』を扱う関数を作った話」で関数を作成されています 色相の変更 adjust-hue($color, $degrees) 色相環の度数($degrees)を○○degで指定 // ベースとなる色 $base-color: #79a5e0; .adjust-hue { color: adjust-hue($base-color, 60deg); }
配色を考えるのが面倒ならhsl()を使おう - Qiita
hsl()ではhue：色相、saturation：彩度、lightness：輝度の3要素で色を指定します。 RGBより直感的な色指定方法としてCSS3で追加されました。 キーとなるhueさえ最初に決めておけば、あとは彩度と輝度の割合を変えるだけでそれなりにまとまったサイト配色になります。 モックや社内用管理画面をゴリゴリ作る際に覚えておくとべんり！ 指定方法 hue：色相 0～360°の角度の値で指定。 角度のため、例えば400と指定すると40に変換されます。 0=360=red saturation：彩度 0～100%の割合で指定。 100％＝純色、0%＝灰色 lightness：輝度 0～100%の割合で指定。 100%=白、50％=純色、0%=黒 （明度とは異なるので注意。明度は100%=純色、0%=黒。） 例）hue=0 の場合の変化 See the Pen hsl() による色の
CSS Gradient Animator
@-webkit-keyframes AnimationName { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @-moz-keyframes AnimationName { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @-o-keyframes AnimationName { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
25 Colorful Websites for Style Inspiration - Vandelay Design
Color is an important aspect of any type of design. In web design, bold use of color is often avoided, but certain websites embrace a more aggressive use of color. This page showcase some beautiful examples of websites that use a lot of colors or bold colors to create designs that stand out. If you’re looking to design your own website, we highly recommend the WordPress themes from Elegant Themes.
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sassで色を管理する色々な方法 - Qiita
