Web制作をちょっとでも楽にしたいならコレ!お役立ちツールまとめ【2020年9月】

こんにちは。デザイナーのしゅん(@shun_webdesign)です。
皆さんはWeb制作やデザインを作る時にツールを使うことはありますか?

ボクがWebデザインの学習を始めた当初「画像探すの大変だなー」とか「コーディングのときにクラス名決められない」「配色どの色がいいのかな」って悩んだ末にお役立ちツールを見つけた時は「こんな便利なツールが世の中にはたくさんあるんだ」と感動した覚えがあります。

そうした気持ちから毎月ツール集の紹介記事を投稿しています。そんな悩みの解決に少しでもお役にたてたら幸いです。
それでは今月もお役立ちWebツールについてまとめさせていただきましたのでご覧ください。

関連記事

誰でも簡単操作で使えるWebデザインツール集【2020年8月】 Web制作をさらに便利にするツール集【2020年7月】 Web制作に役立つリンク、ツール集【2020年6月まとめ】

a11yresources

Webツールやお役立ちリンクをまとめたサイト。これ一つブックマークするだけでツールには困らないです。

https://a11yresources.webflow.io/

AI Image Enhancer

画像の色彩を自動で加工してくれるツール。AI搭載の画像エンハンサーが画像の品質を向上させます。

https://imglarger.com/Enhancer

Limus

スクリーンショットや画像を様々な角度に加工、編集できます。
画像の背景透過にも対応しており、ブラウザの画面をスクリーンショットしてウェブサイトの紹介等にも使えそうです。

https://limus.netlify.app/

codic

ネーミングツール。コーディングの際にクラス名を決めるのに便利です。 VScodeの拡張機能にも対応しています。

https://codic.jp/

Ztext.js

文字を立体的に見せるJSライブラリ。

https://bennettfeely.com/ztext/

Beautiful CSS box-shadow examples

サービスやアプリのbox-shadowを使えるサイト。
80種類以上あってどれもクリックするだけでコピーできて貼り付けれます。

https://getcssscan.com/css-box-shadow-examples




Gradient Magic

ユニークなCSSグラデーションの無料ギャラリー。CSSコードをコピーするだけで手軽に使うことができて、カラフルなものからシンプルな背景まで数多く取り揃えています。

https://www.gradientmagic.com/

Iconscout Converter

画像変換ツール。下記画像の通り、SVGからPNG、JPG、PDFに変換などに対応しています。
フォトショやイラレなどが無くてもブラウザ上で変換することが可能です。

https://iconscout.com/converter/svg-to-png

Loaf

自由にアイコンをカスタマイズできるアイコンライブラリ。

https://getloaf.io/

3D Style Icons Pack by iconshock

3Dアイコンセット。
50個のアイコン、1080x1080px 1つのアイコン、4000x4000px 1つのカラーパレット 1つの視点のみ 透明なPNGファイル 個人使用のみ

https://www.iconshock.com/3d-icons/

iconhub

約100種類のアイコンをサイズや色、線の太さ等自由にカスタマイズができるアイコンセット。

https://iconhub.io/

Emblemicons

約1000種類あるアイコンからSVG,PNG,JPG,PDFでダウンロードすることが可能です。

https://emblemicons.in/

Noun Project Photos

約300万種類のアイコンと画像の検索ができるサービス。

https://thenounproject.com/

Marker Illustrations

個人または商用可能のフリーイラスト集。

https://usepastel.com/marker-illustrations

Pixeltrue

様々なタッチのフリーイラストがダウンロードできます。中に動くイラストもあり、クオリティが高いです。

https://www.pixeltrue.com/free-illustrations

MergeURL

最大5つまでリンクをまとめて短縮してくれるツール。

https://mergeurl.com/

 

最後に

気になるお役立ちツールはありましたか?

ツールを使用するのはあくまでも手段の一つですので今後皆さんのお役にたてたら幸いです。
最後まで見ていただきありがとうございます。是非記事のシェアをよろしくお願いします。

コメントを残す

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

CAPTCHA