Webデザイナー向け

CSS/HTML

Tailwind.cssのためのオープンソースのモダンなUIコンポーネントライブラリ・「Sailboat UI」
ジェネレーター

AIによるシームレスなパターン背景を生成できる・「PatternedAI」
編集ツール

ダイアグラム生成用言語のD2の使い方をオンラインで学べる・「D2 Playground」
Ads
共有系サイト

任意のWebページの静的プレビューを取得し、共有できるブラウザ拡張・「Mirrorful」
CSS/HTML

モダンで美しいオープンソースのTailwind.cssコンポーネント集・「Ripple UI」
検索エンジン

開発者やデザイナー、マーケター、ライターなど向けのツールを無料で使えるもののみ収集している・「Mr. Free Tools」
その他

WebフォントやSVGの他、FigmaやVue、React、Flutterなどもサポートされている2300以上のオープンソースアイコンプロジェクト・「Atlas Icons」
ソフトウェア

アニメーション付与も可能な、ピクセルアートなどローポリ専用のオープンソース3Dモデルエディター・「Blockbench」
ジェネレーター

Web上での様々な活動に貢献してくれそうな無料ツールを大量に公開している・「1Tools」
ソフトウェア

クロスプラットフォームで動作するオープンソースのリモートデスクトップツール・「HopToDesk」
編集ツール

Tailwind.css+ Alpine.jsのコードをプレビューとエディター付きで探せる・「Windl」
フレームワーク

ダークモードやナビゲーションバーも用意されている10kbほどの軽量なクラスレスCSS・「Bahunya」
ジェネレーター

WCAG に準拠した色の組み合わせを簡単に作成できるWebアプリ・「Accessible color palette generator」
その他

最新テクノロジーに関するアイコンをフォントで提供するアイコンセット・「Futicons」
その他

Material Designの原則に従ってデザインされたオープンソースのアイコンライブラリ・「Circum」
その他

開発者やマーケター、デザイナー等に有益なツールやリソースを探せる・「Resource.fyi」
その他

汎用的で使いやすいオープンソースのSVGアイコンのセット・「Slim icons」
ソフトウェア

任意のURLを入力するだけでCSSを解析し、品質をチェックしてくれるオープンソースのWebアプリ・「CSS Code Quality」
ソフトウェア

カラーピッカーやルーラー、テキスト編集や要素の移動や削除、コード抽出などを任意のWebページで実行できるOSSの開発者向けブラウザ拡張・「SuperDev」
JavaScript

スクロールに連動した演出をサポートするオープンソースの軽量スクロールライブラリ・「Lenis」
ソフトウェア

デザインシステムの為のオープンソースのスターターキット・「kickstartDS」
ジェネレーター

デザイントークンを作成し、まとめてCSS変数にしてくれる・「Design Tokens Generator」
次のページ