Tailwind製のECサイト向けコンポーネント集・「Tailwind Ecommerce」
Tailwind Ecommerce Tailwind EcommerceはTailwind製のECサイト向けコンポーネント集です。Tailwind.cssベースのE-commerceで使えるWebコンポーネントといくつかのWebペー...
Resource - Webデザイナー向け
オープンソースのピクセルアートなアイコンセット・「Skware」
Skware Skwareはオープンソースのピクセルアートなアイコンセットです。小さめのドットでアイコンとしての可視性も低くなく、スケーラブルなアイコンとなっており割と汎用的な印象です。 種類は100個ほどとなっています。フォー...
多くの機能が永久に無料で使える、フリーランサー向けに開発されたプロジェクト管理ツール・「Hectic」
Hectic Hecticはフリーランサー向けに開発されたプロジェクト管理ツールです。プロジェクトの大半を1人、或いは少人数で対応する事が求められるフリーランサーが有益と思えるような機能が備わっています。 機能はプロジェクト管理...
様々なオープンソースのアイコンプロジェクトを編集してダウンロードしたりコードをその場でコピーできる・「Iconer」
Iconer Iconerは様々なオープンソースのアイコンプロジェクトを編集してダウンロードしたりコードをその場でコピーできるWebアプリです。 FeatherやIonic、Heroiconsなどなど頻繁に利用されているアイコン...
無料で利用可能な静的Webサイト構築の為のボイラープレート・「Static Starter」
Static Starter Static Starterは無料で利用可能な静的Webサイト構築の為のボイラープレートです。開発者が培った過去のキャリアが元になったベストプラクティスが詰まっているのだそう。 初級者から中級者まで...
線や棒、円、ドーナツ、散布図などのグラフを数値やテキストの入力のみで簡単に作れるグラフジェネレーター・「Graph Maker」
Graph Maker Graph Makerは線や棒、円、ドーナツなどのグラフを数値やテキストの入力のみで簡単に作れるグラフジェネレーターです。 作成可能なチャートは折れ線グラフ、棒グラフ、円グラフ、ドーナツチャート、散布図、...
Sassベースの軽量でモダンなオープンソースCSSデザインシステム・「Spruce」
Spruce SpruceはSassベースの軽量でモダンなオープンソースCSSデザインシステムです。多様なプロジェクトの確かな土台となるミニマルなフレームワークを目指しているそうです。 このフレームワークの開発者としてのミニマル...
ダミーのユーザー写真やアイコン、名前などをランダム生成するWebアプリ・「Random users」
Random users Random usersはダミーのユーザー写真やアイコン、名前などをランダム生成するWebアプリです。 写真、アイコン、名前はランダム生成され、写真は性別、カラー、白黒、セピアなどの絞り込みも可能です。...
メモを取る感覚で使えるChrome拡張のOSSな電卓アプリ・「Calculator Notepad」
Calculator Notepad Calculator Notepadはメモを取る感覚で使えるChrome拡張のOSSな電卓アプリです。日常的に紙にメモ感覚で計算する事があると思います（今は無いかもですが）が、それをChrom...
class属性を利用するCSSライクなデザインエンジン・「Master Styles」
Master Styles Master Stylesはclass属性を利用するCSSライクなデザインエンジンです。本サイトでは拡張された構文を持った仮想CSS言語と説明しています。 実際に見た方がどういう事か把握できると思うの...
クレジット表記不要で商用利用もOKのロイヤリティフリーのサウンドをすべて無料でダウンロードできる・「Sampld」
Sampld Sampldはクレジット表記不要で商用利用もOKのロイヤリティフリーのサウンドをすべて無料でダウンロードできるサウンドストックサイトです。 音楽のためのUnsplashを目指しているそうです。今までのこの手の配布サ...
ブラウザで動作するシンプルで使いやすいオープンソースのビジュアルWebサイトビルダー・「Webstudio」
Webstudio Webstudioはブラウザで動作するシンプルで使いやすいオープンソースのビジュアルWebサイトビルダーです。いわゆるノーコードツールとなっており、作成したのちにそのまま公開する事も可能です。 上SSは操...
テキストチャットやメッセージングアプリ等の会話をアニメーション付きでシミュレートし、webmやgifでダウンロードできる・「Text Chat Animator」
Text Chat Animator Text Chat Animatorはテキストチャットやメッセージングアプリ等の会話をアニメーション付きでシミュレートし、webmやgifでダウンロードできるWebアプリです。 実際に入力し...
CSSライクに書けるオープンソースのデータバインディングJavaScriptライブラリ・「Corset」
Corset See the Pen Counter example by kachibito (@kachibito) on CodePen. CorsetはCSSライクに書けるオープンソースのデータバインデ...
テキスト/アイコンベースのシンプルなアバターを生成するReactライブラリ・「Avvvatars」
Avvvatars Avvvatarsはテキスト/アイコンベースのシンプルなアバターを生成するReactライブラリです。任意の画像等を選択しないユーザーの為のもの、という感じ。 40の色と60のアイコン、入力されたテキスト（ユー...
画像内の消したい部分を指定するだけでAIで自動消去してくれる・「Magic Eraser」
Magic Eraser Magic Eraserは画像内の消したい部分を指定するだけでAIで自動消去してくれるWebアプリです。 もはや珍しいものでは無くなったこの手のAIによる画像加工ツールは当ブログでも何度かご紹介していま...
軽量で非依存のモダンなCSSフレームワーク・「Uimini」
Uimini Uiminiは軽量で非依存のモダンなCSSフレームワークです。フルRWD対応、テーマのカスタマイズや他フレームワークとの併用も可能です。 JS不要、圧縮版でわずか4kbの超軽量なスタイルシートとなっており、パフォー...
見やすくシンプルなWebサイトをクラスレスで構築するための軽量スタイルシート・「Almond.CSS」
Almond.CSS See the Pen Untitled by kachibito (@kachibito) on CodePen. Almond.CSSは見やすくシンプルなWebサイトをクラスレスで構築...
チームで利用可能の、モダンなUIで見やすく使いやすいオープンソースのプロトタイピングツール・「Penpot」
Penpot Penpotはチームで使えるモダンなUIで見やすく使いやすいオープンソースのプロトタイピングツールです。ブラウザベース且つウェブ標準のSVGを採用し、クロスプラットフォームでの動作に配慮されています。 モダンで見や...
URLの差し替えでも代替可能なプライバシーフレンドリーなオープンソースのGoogleフォント代替・「Fonts」
Fonts FontsはプライバシーフレンドリーなオープンソースのGoogleフォント代替です。互換性があり、以下のようにするだけで置き換える事が出来るそうです。 👆これを以下のように 或い...
やや緩いタッチで描かれた手書きの線画アイコンのセット・「Doodle Icons」
Doodle Icons Doodle Iconsは、やや緩いタッチで描かれた手書きの線画アイコンのセットです。手書き風ではありますがしっかり認識できるようにデザインされています。 アイコンは400以上用意されており、PNG、S...
モダンなWebサイト構築の為のTailwind.css向けUIコンポーネントライブラリ・「TailGrids」
TailGrids TailGridsはモダンなWebサイト構築の為のTailwind.css向けUIコンポーネントライブラリです。よく使われるUIの他にカードや認証、フォームやモーダル、テーブル、価格表などなどWebアプリや企業サイ...