ウェブサイトをデザインする際に、自動化できる作業を自動化できているのといないのとでは全く効率が違います。また、デザイン面でも、一人でうんうん考えているよりはインスピレーションがあった方が絶対にいいでしょう。…と、いうわけで、本記事では、CSS で ウェブサイトをデザインする際に大変役に立つサイトをいくつかご紹介します。控えめに言って、これらのサイトを知っているのと知っていないのとでは、作業時間が大違いです!
そんな、CSSデザインに役立つ神サイトたち。初心者のデザイナーさんも上級デザイナーさんも、ぜひ参考になさってください。
今どきのウェブサイトをつくろう!差がつくHTML/CSSコードスニペット27個まとめ
ブックマークしておくと超べんり!
コピペするだけで使えるCSSボタンジェネレーターまとめ
角丸からグラデーション・影の設定までCSSだけでボタンをデザインすることも多いと思います。CSSを1から書くのは面倒って方はCSSジェネレーターでデザインするのも方法の一つです。今回は、詳細まで作り込める使いやすそうなCSSボタンジェネレーターをご紹介。
保存版!CSS3で出来る素敵なデザインやアニメーションをまとめてみた
ちょっと前の記事ですが、いまだにグーグル検索結果上位にヒットします。CSSでできることが簡潔にまとめてある非常に良記事です。基本のおさらいにもなりますし、煮詰まった時に「その手があったか!」的アイデアも呼び起こさせてくれる可能性もあります。というわけで、初心者のデザイナーさんも上級デザイナーさんも、たまに覗くといいかもですね。
とにーかく鬼便利です。まさに、ブックマーク必須の神CSSサイト。
以下の全部が数秒でできてCSSを生成してくれます。かくじつに、作業時間が大幅に節約できるのでとにかくおさえておきましょう。
- Border Radius
- Box Shadow
- Text Shadow
- RGBA
- @Font Face
- Multiple Columns
- Box Resize
- Box Sizing
- Outline
- Transition
- Flexbox
- Gradient
すごく役立った!サイト制作でさりげなく使われているCSSテクニックまとめ
こちらは初心者デザイナーさんたちにオススメの記事。ちょっと古い記事なので色々気になる点もありつつ、CSSでできる事を理解するには最適です。