手書き風のUIコンポーネントを提供するライブラリ・「Wired Elements」
Wired Elements Wired Elementsは手書き風のUIコンポーネントを提供するライブラリです。UIはWeb Componentsとして実装されており、手書きライクな見た目はRough.jsが用いられていますので、よ...
Resource - Archives
textareaやinputで入力可能な残り文字数を表示する非依存のスクリプト・「short-and-sweet」
short-and-sweet short-and-sweetはフォームの入力エリアで、maxlength属性で文字数が制限された項目に残り文字数を表示するスクリプトです。非依存型で軽量、使い方も簡単です。表示文字列はカスタムデータ属...
オープンソースのポッドキャスト/RSSリーダーアプリ・「Winds」
Winds WindsはOSSで提供されるポッドキャスト/RSSリーダーです。各OSで動作する他、無料で利用できるWeb版もあるようです。OPMLにも対応しており、移行も容易に可能となっています。次々と消えていく主要なRSSリーダーに...
ポリゴンな背景パターンを生成できる・「Trianglify.io」
Trianglify.io Trianglify.ioはポリゴンな背景パターンを生成、ダウンロードできるジェネレーターです。結果を確認しながら高さや背景、細かさや色などを指定して作成する事が出来ます。リンク等も不要で、作成したポリゴン...
Vue.jsを使用したデスクトップアプリを作成できる・「Vuido」
Vuido VuidoはVue.jsを使用したデスクトップアプリを作成できるフレームワークです。libuiライブラリが使用されていますのでProton Nativeと似たような感じかもしれません。各OSで動作するよう設計されており、E...
イベントを作成、管理できるオープンソースのmeetupクローン・「MeetHub」
MeetHub MeetHubはオープンソースのmeetupクローンです。イベントをユーザーが作成、管理できる、というシンプルなもの。PythonとDjangoで構築されているそうです。meetup自体日本語化されていますが、個人的に...
1日＝1440分を10分単位で分割し、144ブロックで1日を管理する・「144blocks」
144blocks 144blocksは1日を144ブロックで分割するWebサービスです。ケビン・クルーズの「1440分の使い方」のような時間管理術をサポートしてくれる、みたいなツールです。選べるアイコン（行動パターン）も沢山あります...
タスクやノート、タブを一元管理できるChromeエクステンション・「Jety」
Jety Jetyはタスクやノート、開いているタブを一元管理出来るChromeエクステンションです。スタートページでタブを管理したり、Todoの作成、ノートを作成する事が可能で他にも天気や時間、Web検索も可能と、よくあるTodoアプ...
ログインフォームでアバターが入力内容を目で追うUI・「Animated SVG Avatar」
Animated SVG Avatar See the Pen Animated SVG Avatar by Darin (@dsenneff) on CodePen.0 Animated SVG AvatarはSVGで...
超シンプルなベクターグラフィックツール・「Dotgrid」
Dotgrid Dotgridは超シンプルなベクターグラフィックツールです。四方400pxあるかどうかという小さなツールですが、性能はなかなかに強力という印象でした。操作は基本的にショートカットで行います。動作も軽量で機能もシンプルな...
画像の見た目に合わせたドロップシャドウを作り出すスクリプト・「Image-shadow」
Image-shadow Image-shadowは画像の見た目に合わせて陰影を作成するスクリプトです。非依存型で単体で動作します。コードよく見てないけど画像のクローンを作成してblurさせて下に配置、を自動でやってくれる、みたいなも...
スマフォで横スクロールがある場合はその旨をアイコンで明示してくれるスクリプト・「ScrollHint」
ScrollHint ScrollHintはスマフォでWebページを見た際に横スクロール可能なtable等があった場合に、その旨をアイコン等で明示してくれるスクリプトです。国産CMSのa-blogを提供するappleple社さんが開発...
無料で使える音源を大量に配布する・「Fugue」
Fugue Fugueは商用でも無料で使えるさまざまなタイプの音源を大量に配布するプロジェクトサイトです。当ブログでもよく紹介させて頂いているIcons8のプロジェクトで、被リンクが条件（CC BY 3.0ラインセンス）ですが商用でも...
CSS Gridベースのを作成できるジェネレーター・「CSS Grid Layout Interface Builder」
CSS Grid Layout Interface Builder CSS Grid Layout Interface BuilderはCSS Gridベースのレイアウトをインタラクティブに作成できるジェネレーターです。特に細かい説明...
イラストレーター向けのツール等を紹介する・「illustration.tools」
illustration.tools illustration.toolsはイラストレーター向けのツールやリソースを紹介するWebサイトです。沢山の驚くべき無料ブラシ云々の類ではなく、Adobe Illustrator用のスクリプトや...
ロイヤリティフリーな音源を毎週配布するプロジェクト・「No Lick」
No Lick No Lickはロイヤリティフリーな音源を毎週配布するプロジェクトです。さらにNo Copyright(著作権フリー)も謳っています。NCSに近いものを配布するようで、時間も3～4分と長めの音源となっています。ダウンロ...
DOM要素をドラッグで複数選択するスクリプト・「selection.js」
selection.js selection.jsは要素の複数う選択を可能にするスクリプトです。非依存で単体で動作します。上サンプルのように、複数並べられたボックスをドラッグで選択する事が可能で、タッチデバイスにも対応させることも可能...
複数のストックフォトサイトを一括でまとめて検索できるブックマークレット・「STOCK PHOTO SEARCH」
STOCK PHOTO SEARCH STOCK PHOTO SEARCHは複数ストックフォトサイトをまとめて一括でキーワードまたは類似画像を検索できるブックマークレットです。起動させるとツール（ が呼ぼ出されます）が表示されるのでキ...
オープンソースのシンプルな自動保存ノートWebアプリ・「Wrish」
Wrish Wrishはシンプルなノートアプリです。Webブラウザで動作、自動保存してくれます。アクセスすれば#付きのURLが発行、そのURLがノートページとなります。ブラウザベースなので特別な操作も不要でスマフォでも利用可能です。1...
超軽量なCSS gridベースのフレームワーク・「Smart CSS Grid」
Smart CSS Grid Smart CSS Gridは超軽量なCSS gridベースのグリッドシステムです。0.5kbでレスポンシブ、ネストも不要でグリッドレイアウトを構築できる、というもの。HTMLも少なくて済むのでスマートな...
Bootstrapベースのスタイルガイド用テンプレート・「Bootstrap Style Guide Boilerplate」
Bootstrap Style Guide Boilerplate Bootstrap Style Guide BoilerplateはBootstrapベースのスタイルガイド用Boilerplateです。スタイルガイド作成の手間を省...
完成形を見ながらインタラクティブにCSSグリッドのコードを生成する・「cssgr.id」
cssgr.id cssgr.idはCSSグリッドのコードをインタラクティブに生成するジェネレーターです。シンプルにそれ以上でも以下でもないものです。生成されるコードは以下のようなものです。 CSSグリッドはコンテナを並...