Resource - Webデザイナー向け

ミニマルなスタイルの汎用的なオープンソース線画アイコンセット・「Basicons」

Basicons Basiconsはミニマルなスタイルで汎用的に使えるようデザインされたオープンソースの線画アイコンセットです。 サイズやストロークの太さなどを設定して個別にDLしたりまとめてDL出来るようになっています。 ...

画像のメイン部分を残し、自動で背景を削除するオンラインの切り抜きツール・「Slazzer」

Slazzer Slazzerは画像のメイン部分を残し、自動で背景を削除するオンラインの切り抜きツールです。 以前にご紹介したremove.bgやSocialBook Free Background Removerなどの後発...

CSSやHTML、JavaScript等で、似たような挙動をするタグや方法で何が違うのかを解説する・「this vs that」

this vs that this vs thatはCSSやHTML、JavaScript等で、似たような挙動をするタグや方法で何が違うのかを解説するWebサイトです。 ちょっと何言ってるか分からない、という方もいらっしゃると思...
Ads

商用でも無料で使える1000以上のミニマルなオープンソースのアイコンセット・「Teenyicons」

Teenyicons Teenyiconsは商用でも無料で使える1000以上のミニマルなオープンソースのアイコンセットです。 ラインタイプと塗りつぶしタイプの2種が500以上用意されており、合わせて1000以上のアイコンがセット...

アニメーションしながら動的に順位が入れ替わるバーチャートを生成できるOSS・「Bar chart race generator」

Bar chart race generator Bar chart race generatorはアニメーションしながら動的に順位が入れ替わるバーチャートを生成できるOSSです。Bar chart raceって言うんですね。初めて知...

デザイナーの業務をサポートするツールやリソースを集約した・「Design Resources」

Design Resources Design Resourcesはデザイナーの業務をサポートするツールやリソースを集約したキュレーションサイトです。 多くの役割を担う各業界の様々なデザイナーの方の業務をサポートしてくれるような...

WebサイトやWebアプリ開発に関わる業務の方向けのツールを大量に収集している・「appydev」

appydev appydevはWebサイトやWebアプリ開発に関わる業務の方向けのツールを大量に収集しているWebサイトです。 やや偏りは感じますが、フロントエンドやマーケティング、デザインなどに関わる方には特に役立ちそうなツ...

顔や服、髪型、色や表情など様々なパーツをランダムに組み合わせた人物イラストを生成し、Webサイトやアプリ等に使用できるOSS・「Big Heads」

Big Heads Big Headsは顔や服、髪型、色や表情など様々なパーツをランダムに組み合わせた人物イラストを生成し、Webサイトやアプリ等に埋め込めるツールです。 パーツは17種用意されており、組み合わせる事で10億通り...

ベースカラーを入力するだけで良い感じのカラーパレットを複数提案してくれる・「ColorSpace」

ColorSpace ColorSpaceはベースカラーを入力するだけで良い感じのカラーパレットを複数提案してくれるカラーツールです。 任意のカラーを選択するだけで自動でその色と相性の良い様々なタイプの良い感じのカラーパレットを...

レスポンシブ対応の動的なダミー画像を提供する・「TwicPics Placeholders」

TwicPics Placeholders See the Pen Placeholders by TwicPics (aspect ratio padding trick) by kachibito (@kachibito...

応答性、読みやすさ、モジュール性を重視して設計されたミニマルなCSSフレームワーク・「mono/color」

mono/color mono/colorは応答性、リーダビリティ、モジュール性を重視して設計されたミニマルなCSSフレームワークです。 必要な物だけを揃えたモノクロタイプと、カラースキームやカードUI、ユーティリティなども揃え...

モジュール形式のCSSボタンシステム・「knopf.css」

knopf.css See the Pen Knopf.css – Tests by kachibito (@kachibito) on CodePen. knopf.cssはモジュール形式のCSSボタンシステムです。...

オープンソースのプロジェクトを探したり比較できる・「Openbase」

Openbase OpenbaseはGithub等で公開されているオープンソースのプロジェクトを探したり比較できるWebアプリです。 TopページではJavaScriptやCSSなどのフレームワークを比較できると謳っていますが、...

FlexboxやCSS Gridでよく用いられるレイアウトのコードを提供する・「1-Line Layouts*」

1-Line Layouts* 1-Line Layouts*はFlexboxやCSS Gridでよく用いられるレイアウトのコードを提供するプロジェクトサイトです。 センター配置やサイドバーを持った2カラムレイアウト、ヘッダ/メ...

テキストや背景のグラデーションカラーを手軽に設定できるCSSライブラリ・「grxdients.css」

grxdients.css See the Pen KKVRrbN by kachibito (@kachibito) on CodePen. grxdients.cssはテキストや背景のグラデーションカラーを手軽...

HTML/CSS/JavaScriptで作られた汎用的なCC0のコンポーネントを動作確認したりコードをコピーしたり選んでまとめてダウンロードできる・「html.systems」

html.systems html.systemsはHTML/CSS/JavaScriptで作られた汎用的なコンポーネントをまとめたプロジェクトサイトです。 各コンポーネントはその場で動作や表示の確認をしたり、コードをコピーした...

サクサク使えるシンプルなカラーパレット生成ツール・「Color Palette Generator」

Color Palette Generator Color Palette Generatorはサクサク使えるシンプルなカラーパレット生成ツールです。 5色固定のランダム生成ですが基本的にspaceキーとCキーの2つのキーボード...

任意のキーワードでブランドと、そのロゴやテーマカラーを調べられる検索エンジン・「Brandfetch」

Brandfetch Brandfetchは任意のキーワードでブランドと、そのロゴやテーマカラーを調べられる検索エンジンです。 ブランド名は任意のキーワードを入力すると候補が表示されるインクリメント検索となっており、それぞれのブ...

ユーティリティも用意された超軽量なCSSレイアウトライブラリ・「lyt」

lyt See the Pen gOPXPLK by kachibito (@kachibito) on CodePen. lytはユーティリティも用意された超軽量なCSSレイアウトライブラリです。flexboxベース...

WebサイトやWebアプリのデザインや開発に役立つツールやリソースを探せる・「Webdesign Toolbox」

Webdesign Toolbox Webdesign ToolboxはWebサイトやWebアプリのデザインや開発に役立つツールやリソースを探せるキュレーションサイトです。 フォーラムや各デザインツール、開発ツール、メディアスト...

アートライクな背景パターンを配布する・「Paaatterns」

Paaatterns Paaatternsはアートライクな背景パターンを配布するプロジェクトサイトです。 いくつかのアートなパターンがSketch,やFigma、Adobe XD、Illustrator用のファイルやpng、sv...

生産性や効率の向上に貢献してくれそうなツールやアプリケーションを収集している・「theo.tools」

theo.tools theo.toolsは生産性や効率の向上に貢献してくれそうなツールやアプリケーションを収集しているキュレーションサイトです。 700以上のツールやアプリケーションが集められてて、業種や目的でソート出来るよう...
Ads