超簡単&自動生成!「box-shadowとborder-radiusジェネレーター」が神すぎて…!

超簡単&自動生成!「box-shadowとborder-radiusジェネレーター」が神すぎて…!
スポンサーリンク

毎年必ず1回はインフルエンザになってしまう四条せつなです。

Webサイトのコーディングでちょっと面倒なのが、「box-shadow」と「border-radius」の数値設定ですよね?もしかして…なんとなくでコーディングしてませんか?そんなのもったいない!

四条ねこ
そんな迷える子羊(?)を救ってくれるのが、「box-shadowとborder-radiusジェネレーター」だよー!

この「box-shadowとborder-radiusジェネレーター」は、超絶スグレモノなので、Webデザイナーは使っておきたいサービスです。今更…ですが、今回は「box-shadowとborder-radiusジェネレーター」を紹介しますね。

凄い便利!「box-shadowとborder-radiusジェネレーター」

凄い便利!「box-shadowとborder-radiusジェネレーター」

「box-shadowとborder-radiusジェネレーター」は、その名の通りで…

  • box-shadow
  • border-radius

の2つのCSSを”自動”で生成してくれるWebサービスです!

四条ねこ
これが、めっちゃ便利過ぎて泣けるっ!!!

box-shadowとborder-radiusジェネレーター

それでは、使い方を紹介していきたいと思います!

使い方は”視覚的に確認できる”から本当に簡単!

使い方は"視覚的に確認できる"から本当に簡単!

使い方…と言っても、本当に簡単なWebサービスで、“数値のバー”を動かすだけなんです!

上の画像がそれなんですけど、見てもらったらわかるように非常に簡単です。

四条ねこ
box-shadowとborder-radiusは同時に生成も可能だし、影を複数同時にも生成可能なスグレモノ!本当に、一々自分で考えてたのが悲しいほどに簡単なサービスなんだよー!
box-shadowとborder-radiusジェネレーターのプレビュー

 

プレビューを見ながらできるので失敗もないですよ!

そして、お好みのデザインになったら、ソースコードをCSSにコピペするだけです。

凄くありがたいことに、「Firefox」と「Google Chrome」対策のコードも同時生成してくれますので、失敗もありません。

四条ねこ
これも便利でいいよねー!

せつなのまとめ

「box-shadowとborder-radiusジェネレーター」はめちゃくちゃ便利で、いっつもお世話になっています。いい意味で“コーディングが楽できる”ツールが増えるのは嬉しいことですよね!Webデザイナーで、まだ使ったことない人は、一度使ってみてくださいね。めっちゃ便利!

四条ねこ
「box-shadowとborder-radiusジェネレーター」は神!

ということで、“超簡単&自動生成!「box-shadowとborder-radiusジェネレーター」が神すぎて…!”でした!でわでわっ!

スポンサーリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です