フリーランスエンジニア営業なしで案件受注

コーディング・デザイン便利な無料ツール19選!Twitterの反応良かった順

Web制作(コーディング・デザイン)や資料作成時に使える便利な無料ツール19選まとめ。

全て無料で、簡単に作りたい初心者向けです。

みんな知ってるような定番ツール以外を紹介しています。

コーディング、Webデザイン、資料作成のそれぞれの分野でTwitterでシェアしたときに反応良かった順にまとめます。

Web制作(コーディング)効率化ツール

チートシート

CSSWordPressSEOなどの知識をコピペできるチートシートです。

 

Table Tag Generator

Table Tag Generatorは複雑なHTML表(テーブル)のコードを自動で出してくれるツール。

 

Free Frontend

freefrontend はデザインパーツのコードをコピペできるサイト。

 

CSS三角形作成ツール

CSS三角形作成ツールは、その通り、自動で指定した長さや比率の三角形を作成してくれるツール。

 

CSS Animation Cheat Sheet

CSS Animation Cheat SheetはよくあるjQueryのコードをコピペできるサイト。

 

Menu Maker

Menu MakerはメニューバーのCSSを自動で作れるツール。

 

copy char

copy charは特殊文字をコピペできるサイト。

 

Code Pen

Code Penはパーツデザインのコードをコピペできるサイト。

 

Google Fonts

 

difff(デュフフ)

difffはコードや文章の相違を比較できるツール。

 

Web制作(デザイン)効率化ツール

NIPPON COLORS

NIPPON COLORS は、日本の伝統色を集めたサイトです。和風デザインに使えます。

Odan

Odanは、日本語で世界中の商用フリー画像が検索できるサイト。私はここからいつもブログのサムネ画像を漁ってます。

Girly Drop

Girly Dropは商用利用OK、リンク・クレジット表記不要で女性受けしそうな画像を集めたサイトです。

 

uiGradients

uiGradientsはインスタ風グラデーションのコードを自動生成してくれるツール。

 

UnDrew

UnDrewは無料イラスト配布サイト。

 

ShortCuts

 ShortCutsはAdobe XD、Figma、Sketchなどのショートカットをまとめたサイト。

 

Blobmaker

BlobmakerはロゴをSVG形式で簡単に作れるツール。

 

svgbackgrounds

svgbackgroundsはお洒落な背景を簡単に作れるツール 。

 

パワポなど資料作成の便利ツール

Pictochart

Pictochartはインフォグラフィックが作れるツール。

パワポより簡単にデザイン性の高い資料が作れる。

 

Hislide

Hislideは、パワポ、Google Slidesなどで使えるテンプレート配布サイト。