Google製のSquooshが提供するエンコーダーを使用し、任意の画像を複数まとめて一括圧縮できるオープンソースのWebアプリ・「Squash」
SquashはGoogle製のSquooshが提供するエンコーダーを使用し、任意の画像を複数まとめて一括圧縮できるオープンソースのWebアプリです。使い方も機能もほぼSquooshと同じ感じで、任意の画像を選択するとクオリティは維持したまま大きくサイズを縮小してくれる、というものになります。
Resource - Webデザイナー向け
ReactやNext.js向けに作られたコピペ可能なオープンソースのTailwindベースランディングページコンポーネント・「Page UI」
Page UIはReactやNext.js向けに作られたコピペ可能なオープンソースのTailwindベースランディングページコンポーネントです。Reactアプリ等でLPを頻繁に作成、更新する際に重宝しそうです。
各フレームワークもサポートの、生成AIが使えるオープンソースのリッチテキストエディター・「AIEditor」
AIEditorは各フレームワークもサポートの、生成AIが使えるオープンソースのリッチテキストエディターです。すぐに使えて、フレームワーク完全対応、Markdownフレンドリーなエディターとして提供されています。
タスク管理やプロジェクトのプランニング、チャットなどが1つに詰められたオープンソースのオールインワンプロジェクト管理プラットフォーム・「Huly」
Hulyはタスク管理やプロジェクトのプランニング、チャットなどが1つに詰められたオープンソースのオールインワンプロジェクト管理プラットフォームです。開発者とチームのために作られたタスク・プロジェクト・時間の管理ソリューションとして開発されました。コーダーやプログラマー、PM、デザイナー等、Hulyはチームにおけるワークフローを最適化し、生産性を向上させてくれます。
スクリーンキャストを撮るだけでその行動のチュートリアル動画をAIが生成してくれる・「guidde」
guiddeはスクリーンキャストを撮るだけでその行動のチュートリアル動画をAIが生成してくれるWebアプリです。よくあるWebサイトやアプリの使用法のようなコンテンツをスクリーンキャストからAIが自動作成する、というものになります。
Next.jsアプリ用に設計されたオープンソースの動的SVG管理パッケージ・「svgMagic」
svgMagic svgMagicはNext.jsアプリ用に設計されたオープンソースの動的SVG管理パッケージです。1回のインストール、1行のコード、1回のインポートのみでSVGファイルにおける作業を大幅に軽減できる、というものになり...
非依存で設定等もJavaScriptも不要、HTML要素にクリーンなプリセットスタイルを適用するCSSフレームワーク・「matcha.css」
matcha.cssは非依存で設定等もJavaScriptも不要、HTML要素にクリーンなプリセットスタイルを適用するCSSフレームワークです。柔軟性のあるCSSリセットというイメージです。
fabric.js+Vueベースのオープンソースの軽量ノーコードイメージエディター・「Vue Fabric Editor」
Vue Fabric Editorはfabric.js+Vueベースのオープンソースの軽量ノーコードイメージエディターです。ドラッグ&ドロップで予め用意された素材やテキスト、或いは任意の画像やテキストを追加し、組み合わせて目的の画像をノーコードで作成、ダウンロード出来る、というもの。
React及びNext.jsアプリにシームレスに統合できるよう開発された100以上のオープンソースUIコンポーネント集・「xBesh UI」
xBesh UIはReact及びNext.jsアプリにシームレスに統合できるよう開発された100以上のオープンソースUIコンポーネント集です。shadcn/uiと何が違うの、と思われた方もいるかもしれませんがお察しの通りでshadcn/uiにインスパイアされて開発されたshadcn/ui代替となっています。
品質を維持したまま画像サイズを圧縮できるAIも搭載のオープンソース画像圧縮ツール・「PicWise」
PicWiseは品質を維持したまま画像サイズを圧縮できるAIも搭載のオープンソース画像圧縮ツールです。大昔からあるし今更感満載ですが、今までにない画像圧縮の再定義という試みだそうで、品質を維持したままサイズを最大90%圧縮できるそうです。
シンプルなアイコンを元にロゴをオンラインで作成、DL出来るWebアプリ・「Logo.it」
Logo.itはシンプルなアイコンを元にロゴをオンラインで作成、DL出来るWebアプリです。用意されたシンプルなSVGアイコンのセットから任意のアイコンを選択し、設定してダウンロードする、というもの。
React・React Native向けに作られた、大量のアイコンから選択できるアイコンライブラリ・「rocketicons」
rocketiconsはReact・React Native向けに作られた、大量のアイコンから選択できるアイコンライブラリです。ReactとReact Nativeの両方で同じコードで動作するよう作られているとの事です。
さまざまな開発者向けサービス等のロゴをSVGで提供する・「Svgl」
Svglはさまざまな開発者向けサービス等のロゴをSVGで提供するSVGロゴ配布サイトです。OSSとしてソースコードも公開されています。SveltekitとTailwindで構築しているそうです。従来のアイコン配布サイト等ではあまり見かけなかったものも多く用意されています。
コピー&ペーストで使えるshadcn-ui向けのWebサイト用ブロックを無償提供する・「TWBlocks」
TWBlocksはコピー&ペーストで使えるshadcn-ui向けのWebサイト用ブロックを無償提供するプロジェクトサイトです。SaaS向けに提供してるそうです。
SNS等のソーシャルカードをノーコードで作成出来るオープンソースのWebアプリ・「sharepreviews」
sharepreviewsはSNS等のソーシャルカードをノーコードで作成出来るオープンソースのWebアプリです。例としてFigmaを挙げています。コードを書かずに直感操作でデザイン出来る、というノーコードアプリでSNS等で使えるソーシャルカードに特化したものになります。
Webサイトのコンテンツが盗用されにくいよう防ぐためのシンプルなスクリプト・「NoPeek」
NoPeekはWebサイトのコンテンツが盗用されにくいよう防ぐためのシンプルなスクリプトです。ものすごく今更感ある話題ですが今になっても盗用問題は無くなっていないので少しでも減って欲しいという想いを込めて。簡単な保護法を手軽に導入できる、というものなので期待したものではないかもしれませんが、内容としては従来通り右クリック禁止、デベロッパーツール起動禁止、テキスト選択不可など、アナログな盗用法を一括で防ぐ、というものになります。
Figmaでも利用可能の、400以上のミニマルなアイコンを無料で使えるアイコンセット・「Figicon」
Figiconは400以上のミニマルなアイコンを無料で使えるアイコンセットです。プロジェクトページでは各アイコンの個別DLやSVGのコードのコピーが可能ですが、Figmaで使える.fig拡張子で一括DLも可能です。※メールアドレスが必要
1つのHTML要素とCSSだけで作れる様々なスタイルの吹き出しを作るためのコードをコピーできる・「CSS Generators: Tooltips & Speech Bubbles」
CSS Generators: Tooltips & Speech Bubblesは1つのHTML要素とCSSだけで作れる様々なスタイルの吹き出しを作るためのコードをコピーできるWebサイトです。
Tailwind.cssとの併用も可能な、ミニマルで汎用的なCSSコンポーネント・「Winduum」
WinduumはTailwind.cssとの併用も可能な、ミニマルで汎用的なCSSコンポーネントです。単体でも利用可能ですがTailwind.cssのプラグインとしても使えるようになっています。リセットを含むレイアウト向けのCSS、各ユーティリティ、各UI、コンポーネントなどなどWinduumだけでしっかり様々なタイプのWebサイトやWebアプリに対応できるようになっています。
OSSでコードも公開の、シンプルで扱いやすいベクターベースのモーショングラフィックスアニメーションツール・「Wiggle Animate」
Wiggle Animateはシンプルで扱いやすいベクターベースのモーショングラフィックスアニメーションツールです。HTML/CSS/JavaScriptで書かれており、OSSとしてソースコードも公開されています。
ユーティリティでclamp()を簡単に生成できるようにするTailwindプラグイン・「Fluid for Tailwind CSS」
Fluid for Tailwind CSSはユーティリティでclamp()を簡単に生成できるようにするTailwindプラグインです。コードの記述量を減らし、より見栄えのいいRWDの対応をサポートします
コピペで簡単利用も出来るオープンソースのTailwindベースUIコンポーネントライブラリ・「Tailframes」
Tailframesはシンプルで使いやすいオープンソースのTailwindベースUIコンポーネントライブラリです。コピペで簡単利用できるよう各コンポーネントのコードやサンプルも公開されています。