任意のWebサイトで使われているWebフォントを調査、ダウンロードも可能なWebアプリ・「Font of Web」
Font of Web Font of Webは任意のWebサイトで使われているWebフォントを調査、ダウンロードも可能なWebアプリです。 解析したいWebサイトのURLを入力すると、そのサイトで利用されているWebフォントや...
Resource - Webデザイン補助
ロゴのダミー画像を無償配布するミニプロジェクト・「Placeholder Logos」
Placeholder Logos Placeholder Logosはロゴのダミー画像を無償配布するミニプロジェクトです。 ダミー用に作られたロゴが8種類、それぞれ6色、テキストありと無しの2種、各種SVGとPNGが用意されて...
マウスホバーで任意の要素のCSSをその場で調査、コードをCodepenに送ったりコピーできるブラウザ拡張・「CSS Spider」
CSS Spider CSS Spiderはマウスホバーで任意の要素のCSSをその場で調査、コードをCodepenに送ったりコピーできるブラウザ拡張です。 起動するとマウスホバーで要素のCSSを自動解析し、その場にclassやI...
アクセシビリティに関するツールやリソースなどをカテゴリに分けて大量にまとめている・「a11yresources」
a11yresources a11yresourcesはアクセシビリティに関するツールやリソースなどをカテゴリに分けて大量にまとめているキュレーションサイトです。 書籍やブログ、記事などの情報やブラウザ拡張、ブックマークレットな...
デザイナーに必要なツール等のショートカットのチートシートを1か所に集約した・「Shortcuts.design」
Shortcuts.design Shortcuts.designはデザイナーの方向けに必要なツール等のショートカットのチートシートを1か所に集約したプロジェクトサイトです。 SketchやFigma、各Adobe製品、Affi...
コピー&ペーストで使えるシンプルなアイコンのセット・「Indie Icons」
Indie Icons Indie Iconsはコピー&ペーストで使えるシンプルなアイコンのセットです。アイコンごとにSVGやCSSのコードをコピーする事が出来るようになっており、アイコンをわざわざDLせずとも即利用できるようになって...
画像のメイン部分を残し、自動で背景を削除するオンラインの切り抜きツール・「Slazzer」
Slazzer Slazzerは画像のメイン部分を残し、自動で背景を削除するオンラインの切り抜きツールです。 以前にご紹介したremove.bgやSocialBook Free Background Removerなどの後発...
デザイナーの業務をサポートするツールやリソースを集約した・「Design Resources」
Design Resources Design Resourcesはデザイナーの業務をサポートするツールやリソースを集約したキュレーションサイトです。 多くの役割を担う各業界の様々なデザイナーの方の業務をサポートしてくれるような...
ベースカラーを入力するだけで良い感じのカラーパレットを複数提案してくれる・「ColorSpace」
ColorSpace ColorSpaceはベースカラーを入力するだけで良い感じのカラーパレットを複数提案してくれるカラーツールです。 任意のカラーを選択するだけで自動でその色と相性の良い様々なタイプの良い感じのカラーパレットを...
レスポンシブ対応の動的なダミー画像を提供する・「TwicPics Placeholders」
TwicPics Placeholders See the Pen Placeholders by TwicPics (aspect ratio padding trick) by kachibito (@kachibito...
サクサク使えるシンプルなカラーパレット生成ツール・「Color Palette Generator」
Color Palette Generator Color Palette Generatorはサクサク使えるシンプルなカラーパレット生成ツールです。 5色固定のランダム生成ですが基本的にspaceキーとCキーの2つのキーボード...
アートライクな背景パターンを配布する・「Paaatterns」
Paaatterns Paaatternsはアートライクな背景パターンを配布するプロジェクトサイトです。 いくつかのアートなパターンがSketch,やFigma、Adobe XD、Illustrator用のファイルやpng、sv...
Webサイトやアプリのデザインや開発の際に役立つリソースやツールを各カテゴリに分けて集約した・「Undesign」
Undesign UndesignはWebサイトやアプリのデザインや開発の際に役立つリソースやツールを各カテゴリに分けて集約したキュレーションサイトです かなり細かいカテゴリに分けられているので迷うことなく目的から必要なツール等...
デザインが苦手な開発者向けのツール等をまとめている・「Nodesign.dev」
Nodesign.dev Nodesign.devはデザインが苦手な開発者向けのツール等をまとめているキュレーションサイトです ノンデザイナーズ・デザインブックなどのように基礎を学ぼう、みたいなものではなく、ツールに任せようとい...
2色を選択するだけで関連するカラーパレットを1万以上提案してくれる・「Palette List」
Palette List Palette Listは2色を選択するだけで関連するカラーパレットを1万以上提案してくれるカラーアプリです 用意された12色から選択すれば自動生成されます。パレットはSVGやSASS、CSSなどでダウ...
CC0で配布される150以上のコンポーネントが含まれたモバイル向けプロトタイプ用のワイヤーフレームキット・「Contra」
Contra ContraはCC0で配布される150以上のコンポーネントが含まれたモバイル向けプロトタイプ用のワイヤーフレームキットです 配布されるファイルはFigma、Sketch、Adobe XD、Invision Stud...
説明的なネーミングを施された実験的なカラーパレットを紹介する・「colors.lol」
colors.lol colors.lolは説明的なネーミングを施された実験的なカラーパレットを紹介するプロジェクトサイトです 色の名前の無いものに説明的な名前を付けてパレットを作る、みたいなプロジェクトみたいです。名前にはちょ...
Webデザイナー向けに収集されたカラーとフォントのツールやリソースをまとめている・「Colors & Fonts」
Colors & Fonts Colors & FontsはWebデザイナー向けに収集されたカラーとフォントのツールやリソースをまとめているWebサイトです よくあるキュレーションサイトのように様々なアプリや記事をたんたんと纏め...
CC0で配布されている、髪型や顔などのパーツの組み換え可能な人物イラストを配布するプロジェクト・「Open Peeps」
Open Peeps Open Peepsは髪型や顔などのパーツの組み換え可能な人物イラストを配布するプロジェクトです CC0で配布されており、商用でも個人でも無料で自由にクレジット不要で利用する事が出来ます イラストは全...
ツールやグラデーション、パレットやブランドカラーサンプルなど、色に関する様々な大量のリソースを集約した・「Colorsinspo」
Colorsinspo Colorsinspoは色に関する様々な大量のリソースを集約しているプロジェクトサイトです グラデーションやカラーツール、パレットサンプルやブランドカラーサンプル、インスピレーションの為の情報など、色に関...
コントラストをベースに作れるOSSのカラージェネレーター・「Leonardo」
Leonardo Leonardoは子トラストベースのカラージェネレーターです。設定したキーカラーを元にコントラストを調整する事でカラースキームを生成する、というもの コントラストで調整する事で当方のブログのようにアクセシビリテ...
モックアップ等でダミーテキストを表現する為のSVGを作成出来る・「Wireframer」
Wireframer Wireframerはモックアップ等でダミーテキストを表現する為のSVGを作成できるシンプルなWebアプリです たまにインフィニティスクロールのローディング時での採用も見かけますね。テキストが表示されますよ...