要素にメタリックなスタイルを提供するスタイルシート・「MetalliCSS」
MetalliCSS See the Pen Untitled by kachibito (@kachibito) on CodePen. MetalliCSSは要素にメタリックなスタイルを提供するスタイルシー...
Resource - フレームワーク
使いやすさ、拡張性、スケーリングなどを重視したOSSのマルチベンダーマーケットプレイスプラットフォーム・「OpenMarketplace」
OpenMarketplace OpenMarketplaceは使いやすさ、拡張性、スケーリングなどを重視したオープンソースのマルチベンダーマーケットプレイスプラットフォームです。 PHPフレームワークのSymfonyと、OSS...
マウスの動きに応じて輝くホログラフを実装できる・「pokemon-cards-css」
pokemon-cards-css pokemon-cards-cssはマウスの動きに応じて輝くホログラフを実装できるスタイルシートです。名前の通りでポケモンのトレカのホログラフを再現したものになります。 と言っても自分自身でポ...
Q&Aコミュニティを構築するためのオープンソースプラットフォーム・「Answer」
Answer AnswerはQ&Aコミュニティを構築するためのオープンソースプラットフォームです。Yahoo！知恵袋的な質問コミュニティの開発をサポートします。 Go、React.js、Bootstrap、axiosなどで構築さ...
必要最低限だけ用意されたclass-lessな軽量スタイルシート・「Bolt.css」
Bolt.css Bolt.cssは必要最低限だけ用意されたclass-lessな軽量スタイルシートです。HTML要素のみでミニマルなスタイリングが可能となっています。 従来のクラスレスなCSSと異なり、どちらかというとスタータ...
ReactベースのCRUDアプリを構築するためのオープンソースのヘッドレスWebアプリケーションフレームワーク・「refine」
refine refineはReactベースのCRUDアプリを構築するためのオープンソースのヘッドレスWebアプリケーションフレームワークです。 Create（作成）、Read（読み取り）、Update（更新）、Delete（削...
オープンソースのNode.jsアプリケーション用管理パネル・「AdminJS」
AdminJS AdminJSはオープンソースのNode.jsアプリケーション用管理パネルです。数分で全てのデータを1か所で管理できるNode.jsアプリ用のダッシュボードを構築できるそうです。 提供された複数データをもとに、O...
HTMLやCSSをSVGに変換するためのオープンソースのライブラリ・「Satori」
Satori SatoriはHTMLやCSSをSVGに変換するためのオープンソースのライブラリです。ホスティングサービスのVercel謹製のようです。 イメージ的にはHTMLやCSSを書く感覚でSVGを生成できる、と言った方が近...
ブラウザで任意の要素をクリックするだけでIDEを起動して該当のコードに移動してくれる拡張機能・「Locator.js」
Locator.js Locator.jsはブラウザで任意の要素をクリックするだけでIDEを起動して該当のコードに移動してくれるブラウザ拡張機能です。Chrome、Edge、Brave、Opera、Firefoxなど主要ブラウザは概ね...
パフォーマンス重視でReact専用として作られたオープンソースのStorybook代替・「Ladle」
Ladle LadleはReact専用として作られたオープンソースのStorybook代替です。ControlsとCSFの互換があります。 ご存知の通りStorybookもオープンソースですが、Ladleはパフォーマンスを重視し...
ダークテーマを重視したオープンソースのUIパターンとコンポーネントのコレクション・「Dracula UI」
Dracula UI Dracula UIはダークテーマを重視したオープンソースのUIパターンとコンポーネントのコレクションです。Draculaの名に見覚えのある方も多いかもしれませんが、テキストエディターのダークテーマとしても人気の...
Gutenberg指向のWebサイトを作成するためのモダンなWordPressテーマ開発スターターキット・「Theme Redone」
Theme Redone Theme RedoneはGutenberg指向のWebサイトを作成するためのモダンなWordPressテーマ開発スターターキットです。フレームワークに近いかもしれません。 テンプレートエンジンとしてL...
CSS変数ベースで一貫したデザインのコンポーネント構築できるCSSフレームワーク・「Open Props」
Open Props Open PropsはCSS変数ベースで一貫したデザインのコンポーネント構築できるCSSフレームワークです。 Google Chormeの開発に関わっている方が開発されたみたいでMITライセンスの元でソース...
軽量で高速なWebコンポーネントベースのフロントエンドフレームワーク・「Leaf.js」
Leaf.js Leaf.jsは軽量で高速なWebコンポーネントベースのフロントエンドフレームワークです。ES Modulesも用いられています。 何より使いやすさを重視しており、Webサイトやコンポーネント、ライブラリなどを構...
スクロールやマウスの動きに合わせて視差効果を実装するReactライブラリ・「React Just Parallax」
React Just Parallax React Just Parallaxはスクロールやマウスの動きに合わせて視差効果を実装するReactライブラリです。軽量高速で簡単に書けるのが特長だそう。 マウスの動きに合わせた視差効果...
80以上のUIコンポーネントが用意されたオープンソースのReact.js用UIライブラリ・「PrimeReact」
PrimeReact PrimeReactは80以上のUIコンポーネントが用意されたオープンソースのReact.js用UIライブラリです。更に姉妹プロジェクトのprimeiconsで200以上のアイコンも用意されています。 We...
最近見かけるモダンなカーソルエフェクトを実装できるコードを配布する・「Curzr.」
Curzr. See the Pen Curzr | Free cursor library by kachibito (@kachibito) on CodePen. Curzr.は最近見かけるモダンなカーソ...
90年代を彷彿とさせるカーソルエフェクトを実装するためのライブラリ・「90’s Cursor Effects」
90's Cursor Effects See the Pen Untitled by kachibito (@kachibito) on CodePen. 90's Cursor Effectsは90年代のW...
1つのdiv要素で作れる実用的なCSSローダーのコレクション・「one `div` loaders」
one `div` loaders See the Pen Untitled by kachibito (@kachibito) on CodePen. one `div` loadersは1つのdiv要素で作...
Material UIのReactコンポーネントで構築されているオープンソースの管理画面・「Minimal-UI」
Minimal-UI Minimal-UIはMaterial UIのReactコンポーネントで構築されているオープンソースのダッシュボードテンプレートです。 デモページが7ページほど用意されており、管理画面及びコンポーネントを構...
Webサイトにカスタマイズ可能なコマンドメニューを追加できるライブラリ・「kmenu」
kmenu kmenuはWebサイトにカスタマイズ可能なコマンドメニューを追加できるライブラリです。各コードエディタを始め、最近ではWebアプリ等でも導入されるようになったコマンドメニューを実装できる、というライブラリです。 以...
Twitterなどでの口コミを収集してAirtableにデータを保存し、任意のWebページで紹介出来るOSS・「Open Testimonials」
Open Testimonials Open TestimonialsはTwitterなどでの口コミを収集してAirtableにデータを保存し、任意のWebページで紹介出来るOSSです。英語圏でのWebアプリ等で良く見られるUIですよ...