事前に用意されたコンポーネントとユーティリティクラスでワークフローを強化する軽量でモダンなCSSフレームワーク・「StyleXui」

Ads

StyleXui

事前に用意されたコンポーネントとユーティリティクラスでワークフローを強化する軽量でモダンなCSSフレームワーク・「StyleXui」
StyleXuiは事前に用意されたコンポーネントとユーティリティクラスでワークフローを強化する軽量でモダンなCSSフレームワークです。

アコーディオンや通知、バッジ、フォーム、テーブルにナビゲーションなど基本的なUIコンポーネントに加えて、フォントサイズやカラー、背景、各サイズ設定、paddingやmarginなどなど、よくあるユーティリティクラスも用意された軽量なCSSフレームワークとなっています。

さらに、画像遅延表示やローディングなどのための小さなJavaScriptも備えてあり、一般的なWebサイトの構築の際にあると捗る要素が一式揃えられている印象です。

Ads

CDNも用意されていますし、そもそも依存関係も無いので気軽に試せますね。

<link rel="stylesheet" href="https://cdn.stylexui.com/@v1.0.0-stable/css/xui.css" />
<script src="https://cdn.stylexui.com/@v1.0.0-stable/js/xui.js" defer></script>

役割的にはBootstrapとかに近い気がします。ここ最近はReactやNext.jsのブーム(?)に伴い、Tailwindがスタンダード化していた印象ですが、別の選択肢もあるに越したことは無いので備忘録も兼ねて記事にしました。

とはいえ、まだVersion 1.0.0でリリースも数日前と、開発は始まったばかりで多少の荒と言うか不具合(例えばRWDを謳っているけど、上サンプルの様にtableは未対応等)も見られました。今後の改善に期待したいと思います。

StyleXui