ライブラリやエディタ、フレームワーク等の多種多様なチートシートをまとめている・「Devhints」
Devhints Devhintsはライブラリやエディタ、フレームワーク等の多種多様な技術に関する簡易的なチートシートをまとめているプロジェクトサイトです。vscodeやatomなどのエディタアプリやCSS、HTML、JavaScri...
Resource - Webデザイナー向け
スタッキング出来るモーダルウィンドウ実装スクリプト・「Popbox.js」
Popbox.js Popbox.jsはポップアップをスタッキングできるモーダルウィンドウスクリプトです。表示されたモーダルウィンドウからさらに子ウィンドウを表示できる、というもの。依存性もなく単体で動作、サイズも軽量です。入れ子に出...
シンプルで使いやすいCSSアニメーションライブラリ・「Hexa」
Hexa Hexaはシンプルで使いやすいCSSによるアニメーションライブラリです。要素に指定のclassを付与するだけでアニメーションを与える事が出来ます。classはhexaを基本に、jumpやrotateなど、分かりやすいキーワー...
ホイールタイプのシンプルなカラーパレットジェネレーター・「wheel」
wheel wheelはホイール上にスキームを生み出すカラーパレットツールです。デフォルトでは21色が用意されており、ツールバーで色相や明度等を調整すれば自動で全カラーが変更されるようになっています。ライセンスの明記はありませんがGi...
CSSグラデーションのサンプルを公開しているWebサイトをまとめた・「gradient-backgrounds」
gradient-backgrounds gradient-backgroundsはCSSのグラデーションの様々なサンプルを紹介する複数のWebサイトのハブページです。UigradientsやGrabient、Gradient hun...
一般的なUIを組み合わせてHTMLテンプレートを作成できるソフトウェア・「Stitches」
Stitches Stitchesはよく利用されるUIをD&Dで組み合わせて好みのWebサイトテンプレートを作成できるソフトウェアです。作りもシンプルで個人的に好みだったので備忘録。デフォルトではTailwind CSSがベースとなっ...
モダンなデザインのBoostrapベースのOSSな管理画面テンプレート・「Shards Dashboard Lite」
Shards Dashboard Lite Shards Dashboard Liteはモダンなデザインの管理画面テンプレートです。OSSで公開されており、Bootstrapをベースに構築されています。以前ご紹介したUIキットのSha...
LaravelでCMSを作るためのオープンソースのツールキット・「Twill」
Twill TwillはLaravelの為のCMS作成ツールキットです。Laravelパッケージとして提供されているようです。ドキュメントを見る限りCMSに必要とされる機能は一通りそろえられているようです。OctoberとかLaval...
ソートや内容の編集等が可能なシンプルなデータテーブル実装ライブラリ・「Frappe DataTable」
Frappe DataTable Frappe DataTableはシンプルながらパワフルなデータテーブル実装ライブラリです。列でのソートやセル内の内容の編集、カラムのリサイズ等が可能となっています。上サンプルでは変更していません...
データをグラフ等に可視化出来るオープンソースのスクリプト・「picasso.js」
picasso.js picasso.jsはデータビジュアライゼーションの為のスクリプトです。OSSとして公開されています。様々なグラフにも対応しており、プラグインによる拡張も可能との事。使い方も割と優しい印象でした。可もなく不可もな...
カスタマイズ可能な疑似的なスクロールバーを実装するスクリプト・「fakeScroll」
fakeScroll fakeScrollはカスタマイズ可能なスクロールバーを実装する為のスクリプトです。::-webkit-scrollbarのようにスクロールバーの見た目をカスタマイズし、各ブラウザで統一する為に疑似的にHTML要...
Google Fontsの各フォントをタグ付けして探しやすく整理している・「Font Library」
Font Library Font Libraryは大量に存在するGoogle Fontsのフォントをタグでカテゴライズし、探しやすくするプロジェクトです。OSSとして公開されています。タグ付けし、整理して探しやすくしたもので、各アイ...
UI構築の際に役立ちそうなリソースを収集した・「Ui Goodies」
Ui Goodies Ui GoodiesはUI構築の際に役に立ちそうなリソースをまとめているキュレーションページです。アクセシビリティや色、エフェクト、フレームワークや素材など適切にカテゴライズされており、ストレスなく探すことができ...
任意のWebサイトのスクリーンショットを撮ってEMBEDも出来る・「Snapito」
Snapito Snapitoは任意のWebサイトのSSを撮影、EMBED出来るスクショサービスです。EMBEDというかURLが発行される（Example）のでそのまま利用できる、というもの。モニタサイズの変更や画像サイズなどのオプシ...
CC0のオリジナルな写真素材を配布するストックフォト・「Ulna」
Ulna Ulnaはオリジナルの写真をCC0で配布するストックフォトサイトです。素材はフォトグラファーがCC0でアップロードしてくれる素材を中心としているようで、フォトグラファーはアップロードした素材のアクセス数に応じた報酬が与えられ...
商用でも無料でクレジット表記も不要の、人物イラストを中心に使いやすそうなイラストを大量に公開している・「イラストマン」
イラストマン イラストマンは商用/非商用でも無料且つクレジット表記無しで利用可能なフリーのイラスト配布サイトです。国産サービスで量も結構な量が公開されています。人物イラストが多く、汎用的なものも多いので使いやすい印象でした。やや少しク...
350以上あるWebフレンドリーでオープンソースなSVGアイコンセット・「BoxIcons」
BoxIcons BoxIconsはWebフレンドリーなオープンソースのSVGアイコンセットです。350以上のアイコンが用意されています。使い方はfont-awesomeライクでCSSを読み込み、classを付与すればいいだけです。 ...
ポモドーロタイマー付きのオープンソースなシンプルTodoアプリ・「tasks」
tasks tasksはポモドーロタイマー機能付きのシンプルなTodoアプリです。OSSとして公開されています。タイトルと概要だけの単純なタスク追加と、タスクごとには25分でアラームを鳴らせるようになっている、という非常にシンプルなも...
グラデーションなダミー画像を提供する・「Gradient Joy」
Gradient Joy Gradient Joyはグラデーションなダミー画像を提供してくれるサービスです。従来のダミー画像サービス同様、URLだけで表示可能な他、APIも公開されており、JSONで色の指定も可能です。ダミー画像サービ...
ミニマルなflexboxベースのCSSグリッドシステム・「Katana」
Katana KatanaはミニマルなflexboxベースのCSSグリッドシステムです。calcを使用して軽量化を実現しているみたいです。非圧縮でも1kbほど、.scssなら20行ほどです。clac便利ですねぇ。ライセンスはMITです...
非依存で使いやすいカラーピッカー実装スクリプト・「Flat color picker」
Flat color picker Flat color pickerは他スクリプトに依存せず使えるシンプルでフラットなカラーピッカーです。排出されるコードも3種あり、透過にも対応しています。また、タッチデバイスもサポート。ライセンス...
GitHubスタイルのシンプルなオンラインMarkdownエディタ・「Devpen」
Devpen DevpenはGithubスタイルのオンラインMarkdownエディタです。シンプルに、左カラムで書けば右カラムに反映される、というもの。エディタである事以外に特殊な機能等はほぼ皆無だけど見やすくていいんじゃないでしょう...