Svelte × Tailwind CSSのRabee UI、コンポーネント「Link」とサンプル「Pricing」を追加。変更履歴ページも公開しました
株式会社Rabeeは、Svelte × Tailwind CSSのUIコンポーネント集「Rabee UI」において、コンポーネントの追加やサンプル改善、変更履歴ページの新設を行いました。
📋 記事の処理履歴
- 📰 発表: 2026年5月27日 13:05
- 🔍 収集: 2026年5月31日 23:12(発表から106時間7分後)
- 🤖 AI分析完了: 2026年6月2日 00:35(収集から25時間22分後)
株式会社Rabee(本社:東京都渋谷区、代表取締役:上松 勇喜)は、Svelte × Tailwind CSSのUIコンポーネント集「Rabee UI」において、新たなコンポーネントとサンプルの追加、既存サンプルのアップデート、変更履歴ページの公開を行いました。
## Rabee UIとは
Rabee UIとは、SvelteとTailwind CSSで構築されたUIコンポーネント集であり、カスタマイズして使うことを前提とした「コンポーネントの種」です。プロダクトごとに色やフォント、アニメーションなどを自由にカスタマイズすることで、ブランドらしさを表現するデザインシステムを小さいコストで構築できます。
## Rabee UIの特徴
- Svelte × Tailwind CSSで柔軟にカスタマイズできる
- コンポーネント単位でコピー&ペーストして導入できる
- ダークモード・ライトモードに対応
- 日本語利用を前提としたデザイン
- コードと一致したFigmaデータも公開中
## 新コンポーネント「Link」を追加
今月は新たに「Link」コンポーネントを公開しました。Linkは、本文中のテキストリンクを表示するためのコンポーネントです。「primary」「secondary」の2つのバリアントを切り替えられるほか、disabled状態にも対応しています。
target="_blank" を指定した別タブで開くリンクには、外部リンクアイコンを自動で表示するほか、セキュリティ・パフォーマンスに配慮した rel="noopener noreferrer" も自動付与します。
## 新サンプル「Pricing」を追加
サンプルとして、料金プランを並べて表示する「Pricing」を新たに追加しました。複数のプランをカード形式で並べ、月払い・年払いの切り替えにも対応しているレイアウトの例です。
## 既存コンポーネント「Button」のLoadingサンプルを更新
既存コンポーネント「Button」のLoading状態のサンプルを、連打防止パターンに刷新しました。今回の刷新により、フォーム送信中の二重送信を防ぐ実用的な実装例として確認できるようになっています。
## 変更履歴ページを公開
Rabee UIのドキュメントサイトに、リリースごとの変更点をまとめた「変更履歴」ページを公開しました。新しく追加されたコンポーネント・サンプル、変更点、修正点などを時系列で確認できます。
## Rabee UIとは
Rabee UIとは、SvelteとTailwind CSSで構築されたUIコンポーネント集であり、カスタマイズして使うことを前提とした「コンポーネントの種」です。プロダクトごとに色やフォント、アニメーションなどを自由にカスタマイズすることで、ブランドらしさを表現するデザインシステムを小さいコストで構築できます。
## Rabee UIの特徴
- Svelte × Tailwind CSSで柔軟にカスタマイズできる
- コンポーネント単位でコピー&ペーストして導入できる
- ダークモード・ライトモードに対応
- 日本語利用を前提としたデザイン
- コードと一致したFigmaデータも公開中
## 新コンポーネント「Link」を追加
今月は新たに「Link」コンポーネントを公開しました。Linkは、本文中のテキストリンクを表示するためのコンポーネントです。「primary」「secondary」の2つのバリアントを切り替えられるほか、disabled状態にも対応しています。
target="_blank" を指定した別タブで開くリンクには、外部リンクアイコンを自動で表示するほか、セキュリティ・パフォーマンスに配慮した rel="noopener noreferrer" も自動付与します。
## 新サンプル「Pricing」を追加
サンプルとして、料金プランを並べて表示する「Pricing」を新たに追加しました。複数のプランをカード形式で並べ、月払い・年払いの切り替えにも対応しているレイアウトの例です。
## 既存コンポーネント「Button」のLoadingサンプルを更新
既存コンポーネント「Button」のLoading状態のサンプルを、連打防止パターンに刷新しました。今回の刷新により、フォーム送信中の二重送信を防ぐ実用的な実装例として確認できるようになっています。
## 変更履歴ページを公開
Rabee UIのドキュメントサイトに、リリースごとの変更点をまとめた「変更履歴」ページを公開しました。新しく追加されたコンポーネント・サンプル、変更点、修正点などを時系列で確認できます。
よくある質問
Rabee UIとはどのようなサービスですか?
Rabee UIは、SvelteとTailwind CSSで構築されたUIコンポーネント集です。カスタマイズを前提としており、プロダクトごとのブランドデザインを低コストで構築できます。
今回新たに追加されたコンポーネントは何ですか?
テキストリンクを表示するための「Link」コンポーネントが追加されました。外部リンクへの自動アイコン表示や、セキュリティに配慮した属性の自動付与機能があります。
Rabee UIの最新アップデートに含まれるサンプルは何ですか?
料金プランを並べて表示する「Pricing」サンプルが追加されました。月払い・年払いの切り替えレイアウトなど、SaaSの料金ページ制作に活用できます。
既存の「Button」コンポーネントはどのように更新されましたか?
Loading状態のサンプルが、フォームの二重送信を防ぐ実用的な「連打防止パターン」として刷新されました。
Rabee UIの更新情報はどこで確認できますか?
公式ドキュメントサイトに新設された「変更履歴」ページにて、リリースごとの新機能や修正点を確認可能です。