Resource - Webデザイナー向け

複数のオープンソースのSVGアイコンプロジェクトを横断検索、その場で簡単なカスタマイズも可能なアイコン検索アプリ・「Iconbuddy」

Iconbuddy Iconbuddyは複数のオープンソースのSVGアイコンプロジェクトを横断検索、その場で簡単なカスタマイズも可能なアイコン検索アプリです。 156のアイコンセット、総計10万以上のアイコンから任意のキーワード...

Tailwindコンポーネントをノーコードで作成、編集し、コードをコピーして利用できる・「Mytailwind」

Mytailwind MytailwindはTailwind.cssのコンポーネントをノーコードで作成、編集し、コードをコピーして利用できるWebアプリです。 ボタン、ナビゲーションバー、カード、サイドバー、アラート、画像、チッ...

WebフォントやSVGで用意されたオープンソースの汎用的なアイコンセット・「Mage Icons」

Mage Icons Mage IconsはWebフォントやSVGで用意されたオープンソースの汎用的なアイコンセットです。最初はMegaと誤認しましたけどMage(魔法使い)でした。 Web、iOS、Android、デスクトップ...
Ads

Tailwind.cssベースのパワフルで軽量なオープンソース管理画面テンプレート・「Tailbreeze」

Tailbreeze TailbreezeはTailwind.cssベースのパワフルで軽量なオープンソース管理画面テンプレートです。 この手のテンプレートはご存知のように数えきれないほど出回っていますが、Tailbreezeは中...

Alpine.jsとTailwin.cssの為のオープンソースUIライブラリ・「Pines」

Pines PinesはAlpine.jsとTailwin.cssの為のオープンソースUIライブラリです。両方を使用しているプロジェクトにコピペで導入できるUIを提供しています。 AlpineとTailwindを併用することで、...

任意のWebサイトを編集可能なFigma用ファイルに変換できる・「html.to.design」

html.to.design html.to.designは任意のWebサイトを編集可能なFigma用ファイルに変換できるサービスです。 手順も簡単で、専用のChrome拡張をインストールし、変換したいWebサイトで実行すると、...

three.js用のReactレンダラーであるReact Three Fiber専用に開発されたオープンソースのビジュアルエディター・「Triplex」

Triplex TriplexはReact Three Fiber専用に開発されたオープンソースのビジュアルエディターです。現在のところ、Windows及びMacOSに対応しています。 React Three Fiberはthr...

読みやすさとブルータリズムのデザイン原則を融合させたオープンソースのBootstrapテーマ・「Brutopia」

Brutopia Brutopiaは読みやすさとブルータリズムのデザイン原則を融合させたオープンソースのBootstrapテーマです。 ブルータリズム(Wikipedia)とは建築様式の一種で、機能性の象徴的な様式だそうです。文...

VueやReactもサポートのされたオープンソースのシンプルで汎用的なアイコンセット・「Iconsans」

Iconsans IconsansはVueやReactもサポートのされたオープンソースのシンプルで汎用的なアイコンセットです。MITライセンスのもとで配布されています。 様々なタイプのアプリケーションに利用できるよう、SVGで揃...

デザインシステムにおけるタイポグラフィやアイコン、スペーシング、コンポーネント等のプロポーションスケールを作成出来るWebアプリ・「Proportio」

Proportio Proportioはデザインシステムにおけるタイポグラフィやアイコン、スペーシング、コンポーネント等のプロポーションスケールを作成出来るWebアプリです。 パラメーターを入力して作り出すジェネレーティブなパラ...

医療に関するものを中心に500以上のシンプルなSVGアイコンをフリーで提供する・「svg.health」

svg.health svg.healthは医療に関するものを中心に500以上のシンプルなSVGアイコンをフリーで提供するSVGアイコンプロジェクトです。 CC-BYで提供されており、クレジットを条件に個人でも商用でも無料で利用...

任意の画像内の特定のオブジェクトの色を変更できるAIベースのカラーツール・「Recolor」

Recolor Recolorは任意の画像内の特定のオブジェクトの色を変更できるAIベースのカラーツールです。Webアプリだけでなくスマホアプリ等も用意されています。 画像をアップロードすると、写真内のオブジェクト(服や家具、髪...

カスタマイズ性が高く高速なオープンソースのVue3コンポーネントライブラリ・「Naive UI」

Naive UI Naive UIはカスタマイズ性が高く高速なオープンソースのVue3コンポーネントライブラリです。TSで構築されており、MITライセンスの元でソースコードが公開されています。 シンプルで汎用的なスタイルで構成さ...

CSSとHTMLだけで作れる様々なUIのコードを公開しているCSSスニペットコレクション・「CSS Stock」

CSS Stock CSS StockはCSSとHTMLだけで作れる様々なUIのコードを公開しているCSSスニペットコレクションサイトです。 現在、ボタンやローディング、アコーディオンやFAQ、ツールチップ、TOC、モーダルウィ...

簡単な設定で実装できるスクロール連動アニメーションライブラリ・「Trig.js」

Trig.js See the Pen Untitled by kachibito (@kachibito) on CodePen. Trig.jsは簡単な設定で実装できるスクロール連動アニメーションライブ...

オープンソースで公開されているTailwind.cssベースの管理画面テンプレート・「TailAdmin」

TailAdmin TailAdminはオープンソースで公開されているTailwind.cssベースの管理画面テンプレートです。 プロジェクトのページは有償版の特徴で、OSSとして公開されているものはGithubに詳細が書かれて...

設定に合わせたデザイントークンを発行できるオープンソースのデザインシステムフレームワーク・「mirrorful」

mirrorful mirrorfulは設定に合わせたデザイントークンを発行できるオープンソースのデザインシステムフレームワークです。 デザイントークンとは?という方は、以前もご紹介しましたが以下の記事をご参照下さい。 ...

Stable Diffusionを使用した、3Dポーズエディター機能付きのAI画像生成ツール・「Plask」

Plask PlaskはStable Diffusionを使用した、3Dポーズエディター機能付きのAIベースの画像生成ツールです。ブラウザベースの3Dポーズエディターが搭載されており、3Dポーズ認識機能によって指定したプロンプトと指定...

多種多様なAIツールから目的のツールを探せるコレクションサイト・「TOOLSPEDIA」

TOOLSPEDIA TOOLSPEDIAは多種多様なAIツールから目的のツールを探せるコレクションサイトです。 数日前にご紹介したWikiAIToolsと同様に最近話題の中心でもあるAIをベースとした多種多様なツールをコレクシ...

シンプル且つ汎用的で使いやすそうな300以上のアイコンのセット・「Extra Thicc Icons」

Extra Thicc Icons Extra Thicc Iconsはシンプル且つ汎用的で使いやすそうな300以上のアイコンのセットです。 様々な矢印やバッテリーを示すもの、グリッド、拡大や縮小、コメント、フォルダや地図、un...

任意のプロンプトからHTMLとCSSを生成してその場でプレビュー出来る・「AI CODE」

AI CODE AI CODEは任意のプロンプトからHTMLとCSSを生成してその場でプレビュー出来るAIコード生成アプリです。特に説明は不要かと思いますがタイトルの通りで指示したUI等をHTML/CSSで作成し、その場でプレビュー出...

FigmaやFigjamのテキスト入力にChatGPTを使えるFigmaプラグイン・「FigGPT」

FigGPT FigGPTはFigmaやFigjamのテキスト入力にChatGPTを使えるFigmaプラグインです。要はダミーテキスト生成のプラグインですが、ChatGPTで自然な言葉で自動生成できるのは良いですね。 使い方は簡...
Ads