webデザイン初心者お役立ちツールまとめ

今回は、webデザイン初心者お役立ちツールまとめと題しまして、webデザインをする際や模写コーディングなどをする際に役立つツールなどを紹介していきたいと思います!

模写コーディングについては以前書いた記事をご覧ください!

記事を見に行く

 

フォント、文字のサイズがわかるChrome拡張機能!  ”WhatFont”

 

フォントが知りたい!フォントサイズが知りたい!そんなときに簡単に調べることができるChromeの拡張機能です!

使い方は簡単!ツールを起動してマウスオーバーするだけです!

クリックすればフォントサイズや行間などの詳細も知ることができます!

模写コーディングの際に大変役に立つツールです!

ダウンロード

 

カラーコードが知りたい!そんな時のChrome拡張機能 “ColorPick Eyedropper”

 

目視だけで、詳細な色やカラーコードがわかる人なんていないですよね!

webサイト上の、この色が知りたい!というときに役立つツールです!

こちらも、上記のWhatfont同様、起動してマウスオーバーするだけです!

カラーコードがわかれば、後はコピペして使うだけ!とてもかんたんで便利なツールです!

ダウンロード

配色に困ったときのお役立ちサイト

 

配色ツールといえば、Googleのテリアルデザインの公式配色ツールであるColor Tool

配色作成ツールの Paletton が有名ですが

私のおすすめはサルでもわかる図解解説マガジンでおなじみサルワカの、配色探しツールです!

こちらでは、「万人受けるする配色」「親近感を感じさせる配色」等、配色がカテゴライズされており、配色が苦手な初心者にとてもやさしいツールになっています。クリックでプレビューできる点もありがたい・・・!

 

サルワカの配色探しツール

 

無料で簡単に使えてダウンロード不要の優秀デザインツール!

 

かっこいい、かわいい、おしゃれなアイキャッチ画像を作りたい!

そんな時におすすめなのがブラウザ上で使えるデザインツールCanvaです!

テンプレートから使いたいレイアウトを選んで、自分好みにカスタマイズして、保存するだけです!

保存形式も選べるのがいいですね!

有料の素材を使わなければ無料で使用することができます!

ちなみにこのブログのアイキャッチも上記画像もCanvaで作成しています!

Canva公式サイト

 


以上初心者向けお役立ちツール紹介でした。

他にもまだまだ便利なツールがあるので機会があれば随時紹介していきます!

 

 

 

 

 

 

コメントを残す

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