ブログデザインのときにどんなツールを使っていますか?
アイキャッチやメインビジュアルの作成するときは、いろいろなツールを用いてデザインを作成しています。

いつも使っているサイトをまとめてなかったので、ここを見たら一覧で分かるようにまとめてみました。
この記事では、
- 記事のアイキャッチ作成
- 記事内で使う画像作成
- トップページのデザイン
に役立つ無料デザインツールをご紹介します。
ブログデザインで役立つ無料ツール


わたしが通常つかっているツールは以下の4つです。
- 画像作成ツール
- 配色ツール
- 色を調べたいときに使うツール
- 背景透過ツール
- 【画像圧縮】png→webPに変換ツール
それぞれ詳しく解説していきます。
①Canva(画像作成ツール)
みなさんご存じのCanvaです。

有料プランもありますが、無料プランだけでも十分なラインナップです。
- 【おしゃれな画像が簡単に◎】デザインテンプレートで文字を変えるだけ♪
- 【スマホでも使える】変更したものはPCと連動機能アリ
- 【サイズの迷いなし】使う用途毎にサイズが自動カスタムされている
- 【自由度が高い】他のサイトの画像を使ってデザインできる

アイキャッチが一瞬で作成できるのに、無料なのはすごいよね。
ご存じの方が多いと思いますが、画像作成するときは
表示したいサイズ×2倍
で作成すると画像が粗く表示されるのが防げますよ!
②Color Hunt(配色ツール)


デザインを考えるときに配色で時間がかかることないですか?
私の場合、配色だけで30分くらい時間がかかることも。
しかし、このサイトを知ってからおしゃれな配色が一瞬で見つかるようになりました。

左から人気がある配色や、イメージに合った配色の絞り込みができます。


気に入った配色を選択すると、それぞれの配色コードが表示されます。
※カーソルを合わせると単体でもコピー可能

配色選びに悩むかたはぜひ使ってみてください。
③Colorpick Eyedropper(色を調べたいときに使うツール)

デザインするときに、web上にある特定の色を使いたいと思うことってありませんか?
Colorpick Eyedropperとは、WEBサイト上の色のコードを調べることができる、Google chromeの無料ツールです。

例えば、背景の色を調べたいときに以下のように該当箇所を選択するだけで色コードがわかるツールです。

調べたい色のところにカーソルを合わせるだけで色コードがわかります。


これを知るまでは、似たような色になるように手動で調べたのでラクになりました。
④remove.bg(背景透過ツール)
背景に色を使っている場合、以下のような表示になることはありませんか?


本当は、画像に沿って周りの白枠は取りたい・・!

画像をアップロードすると自動で回りの余分な白い部分を透明にしてくれます♪

背景が透明になったものを再度同じようにアップすると、以下のように白枠がなくなりおしゃれな雰囲気に♪

とても便利なツールなので、ぜひ使ってみてください。
⑤サルワカ道具箱(画像圧縮ツール:png→webPに変換ツール)

画像が多い記事のほうが見やすいですが、あまり多くなると表示速度が遅くなったりしますよね。

そんなときは、画像形式を「webP」に変換しましょう。

変換したい画像をアップロードして、ダウンロードするだけ。

ちなみに、JPEGとPNGに対応しています。
ブログデザインの無料ツールをうまく使おう
ブログデザインをするときに欠かせない、無料ツールについてご紹介しました。

うまく活用しておしゃれなサイトづくりに役立ててくださいね♪
ここまでお読みいただきありがとうございました。
