Webデザイナー向け

ジェネレーター

ダミー画像をSVGまたはbase64で生成するシンプルなWebアプリ・「Placy」
複合/その他

シンプルさとカスタマイズ性の高さでUI設計をサポートするフロントエンドライブラリ・「Xtend UI」
CSS/HTML

軽量、シンプルで使いやすく様々なユーティリティも備えられたCSSフレームワーク・「Beercss」
Ads
その他

動画ファイル内の人物部分のみを切り取って別の動画と合成できる動画背景削除アプリ・「SocialBook Remove Video Background」
ソフトウェア

ReactとFabric.jsで作られたオープンソースのcanva代替となるデザインエディター・「Scenify」
ソフトウェア

縦線、横線、四分円だけを使うオープンソースのミニマルなグラフィックエディター・「minimator」
Webデザイン補助

任意のWebサイトで使用されている色を抽出してパレットやCSSのコードを自動生成する・「Alwane」
ソフトウェア

Deno製のオープンソース静的サイトジェネレーター・「Lume」
その他

ノート、Todo、ブックマーク、ポモドーロなどの機能を1か所にまとめた個人向けのオンラインワークスペースを提供してくれるWebアプリ・「QuickTab」
ソフトウェア

アイコンを管理したりコードをそのままコピーできるオープンソースのデスクトップアプリ・「Icon Shelf」
編集ツール

任意のSVGの各所の色やパスの削除等を簡単に行えるオープンソースのWebアプリ・「SVG Quick Editor」
その他

完成図を見て正しいコードを選択するクイズ形式でCSSを視覚的に学べる・「Guess CSS!」
JavaScript

パララックス効果を簡単に付与できるスクリプト・「simpleParallax.js」
ソフトウェア

非開発者が使う事を想定して開発された、ブラウザで動作するオープンソースのヘッドレスWebページビルダー・「Plasmic」
JavaScript

ブックマークレットも用意されている、引用文を綺麗に見やすくスタイリングするライブラリ・「Quotebacks」
CSS/HTML

導入も楽々な手書き風のスタイリングが可能なスタイルシート・「doodle.css」
CSS/HTML

class不要で見た目をミニマルスタイルに整えてくれるclass-lessなCSSフレームワーク・「DreamCSS」
JavaScript

ツールチップやポップオーバー、ドロップダウンなどのフローティングエレメントを完全制御する為のJavaScriptライブラリ・「Floating UI」
JavaScript

開閉パネルやアコーディオン、タブなど切り替え要素のあるUIの為の軽量JavaScriptライブラリ・「Tiny UI Toggle」
Webデザイン補助

ダミー画像をイラストで生成してくれるダミー画像生成サービス・「Doodle Ipsum」
プログラミング補助

HTMLのタグ内に含めて良いタグかどうかを教えてくれる、HTMLタグのネスト可否チェックツール・「Can I Include」
CSS/HTML

CSS製のボタンやチェックボックス、トグルボタンをその場で作成して共有できる・「cssbuttons.io」
次のページ