コンポーネント

オプションのファイル名ヘッダーとクリップボードへのコピー機能を備えた シンタックスハイライト付きコード表示。

主要な指標や統計をコンパクトなカード形式で表示。 ラベル、値、オプションのトレンドインジケーターを含みます。

さまざまなユースケースに対応する複数のバリアントを持つクリップボードコピーコンポーネント。 ボタン、インライン入力、コードブロックのスタイルに対応し、アニメーション付きの成功フィードバックを備え...

キーと値のペアを表示するためのセマンティックなディスクリプションリスト。 スタック、水平、ストライプの3つのスタイルを用意しています。 アクセシビリティのために適切なdl/dt/dd HTML要...

情報を整理するための展開・折りたたみ式コンテンツセクション。 基本（単一展開）、常時展開（複数同時展開）、ネスト型の3つのバリエーションを用意しています。

画像、イニシャルのフォールバック、オプションのステータスインジケーターを備えたユーザーまたはエンティティの表現。 アバターグループモードでは、設定可能なオーバーラップと「+N人」のオーバーフロー...

組み合わせ可能な機能を備えた柔軟なデータテーブルコンポーネント。ページネーション、 ソート、フィルタリング、検索、一括操作付き行選択、CSVエクスポート、 カラム表示切り替えに対応しています。す...

矢印ナビゲーション、ページネーションドット、タッチ/スワイプ操作、 設定可能なオートプレイを備えたレスポンシブなカルーセル/スライダーコンポーネント。 無限ループとスムーズなCSS遷移に対応して...

ネイティブHTML Drag and Drop APIとStimulusを使用したドラッグ＆ドロップ並べ替えリストとカンバンボード。 外部依存関係不要。ドラッグハンドル、視覚的なドロップインジケ...

プロジェクト管理やタスク追跡のためのドラッグ＆ドロップ対応カンバンボード。 カラーコードされたヘッダーを持つ複数カラム、ラベル・担当者・期日付きのドラッグ可能なカードに対応。 カラム間のドラッグ...

アイコン、タイムスタンプ、コンテンツスロットを備えた時系列イベント表示。垂直スタイルでは アクティビティフィードやチェンジログ用にコネクターラインでイベントを積み重ねます。水平スタイルでは プロ...

日付の表示と選択のためのインタラクティブなカレンダーコンポーネント。 月のナビゲーション、イベントドット、日付範囲制約、 キーボードナビゲーション、週の開始曜日の設定に対応しています。

コンテナの下部付近にスクロールすると自動的にコンテンツを追加読み込み。 シームレスなRails連携のためにTurbo Framesと自然に連動します。IntersectionObserverによ...

目標日時までカウントダウンするアニメーション付きタイマー。シンプルスタイルでは プレーンな数字とラベルを表示。フリップスタイルでは分割カードとCSSキーフレーム アニメーションによる3Dフリップ...

送信者の配置、アバター、タイムスタンプを備えた会話メッセージの表示。 ラウンドスタイルはiMessage風のカラーバブルと角丸を再現。フラットスタイルは Slack風のインライン名、タイムスタン...

月額/年額切り替え付きの料金プラン表示。横並びのカード形式、 またはおすすめプランをハイライトした機能比較表形式で利用できます。