Tools & Resources

ソフトウェア

css gridのコードを生成できる・「Griddy」

複合/その他

Bootstrapで使える要素を170種ほどセットにしてOSSとして配布する・「Froala Design Blocks」

JavaScript

編集可能のシンプルなtableを実装するスクリプト・「jquery-fulltable」

Ads
CSS/HTML

ユニークなエフェクトを要素に付与できるCSSアニメーションライブラリ・「mimic.css」

JavaScript

inputのtype=”file”で送信前に画像を表示させるスクリプト・「file-upload-with-preview」

CSS/HTML

CSSだけでふわっと浮かぶ上がるツールチップを簡単な設定で実装できるCSSライブラリ・「Balloon.css」

JavaScript

ドラッグ&ドロップで作れるコンテンツエディター実装スクリプト・「KEditor」

JavaScript

anime.jsでテキストにアニメーションエフェクトを付与するコードをまとめたサンプル集・「MOVING LETTERS」

ジェネレーター

アップロードされた画像を様々な解像度に変換、問題なく認識できるよう処理してくれるツール・「Logo Crunch」

JavaScript

canvasで描いた円状のシャボン玉っぽいものをランダムに動かし、背景に設定できるスクリプト・「bubbly-bg」

その他

Googleカレンダーを使ったシンプルなタスクマネージャ・「TManager」

その他

カンバンやロードマップなど、チームでプロジェクトを管理できる・「Atlaz」

ソフトウェア

CSVやプレーンテキストのデータをJSONやMarkdown等に変換できるOSSなコンバーター・「Mr. Data Converter」

ソフトウェア

手作り感がかわいい、オープンソースなアイコンフォント・「JAM icons」

JavaScript

軽量でモダンなモジュール式のドラッグ&ドロップライブラリ・「Draggable」

ソフトウェア

書いたソースコードを画像化してTwitterに投稿できる・「carbon」

CSS/HTML

シンプルでスケーラブル、メンテナンス性も意識して設計されたCSSフレームワーク・「zap」

その他

オープンソースの様々なライセンスのざっくりした特徴が一目で分かる早見表・「Choose a License | Appendix」

ソフトウェア

MediumのようなエディターをWordPressに導入できるプラグイン・「WP Medium Editor」

CSS/HTML

シンプルで使いやすい、モバイルフレンドリーなFlexboxベースのCSSフレームワーク・「Framy」

JavaScript

一定の幅にテキストをフィットさせてくれるスクリプト・「Fitty」

デザインギャラリー

グラフや図など、データ可視化の表現パターンをギャラリー化して紹介する・「Data Viz Project」