ようこそデジタル庁デザインシステムへ🐼
デジタル庁デザインシステムウェブサイト新規タブで開きますのコンテンツを加工して作成デジタル庁デザインシステムは、スタイリングの考え方を提供するデザイン言語、情報の視覚表現とインタラクションを具現化するUIコンポーネント、ユーザビリティとアクセシビリティを踏まえた設計や実装のためのガイドラインから構成されるデザインアセットです。
デジタル庁のミッションである「誰一人取り残されない、人に優しいデジタル化を。」の実現に寄与することを標榜し、官公庁や地方自治体などの行政機関や公共性の高い組織等のウェブサイト/ウェブアプリケーション/オンラインサービスまたはシステム等で利用することを念頭に置いて構築されています。
作成: 水戸地図新規タブで開きます
実装状況
| 名称 | recipe | React |
|---|---|---|
| ボタン v2 | ✅ button | ✅ <Button> |
| アコーディオン v2 | ✅ accordion | ✅ <Accordion> |
| ボトムナビゲーション | ❌ | ❌ |
| パンくずリスト v2 | ✅ breadcrumb | ✅ <Breadcrumb> |
| チェックボックス v2 | 🔨 | 🔨 |
| モーダルダイアログ | ❌ | ❌ |
| ディバイダー v2 | ✅ digitalGoDivider | ✅ <Divider> |
| ドロワー v2 | ✅ drawer | ✅ <Drawer> |
| 緊急時バナー | ❌ | ❌ |
| グローバルメニュー | ❌ | ❌ |
| ハンバーガーメニューボタン v2 | ✅ hamburgerMenuButton | ✅ <HamburgerMenuButton> |
| ヘッダーコンテナ | ❌ | ❌ |
| ランゲージセレクター | ❌ | ❌ |
| メガメニュー | ❌ | ❌ |
| メニューリスト v2 | 🔨menuList | 🔨 <MenuList> |
| メニューリストボックス | ❌ | ❌ |
| ノティフィケーションバナー v2 | 🔨 notificationBanner | 🔨 <NotificationBanner> |
| ページネーション | ❌ | ❌ |
| プログレスインジケーター | ❌ | ❌ |
| ラジオボタン v2 | ✅ radio-group | ✅ <RadioGroup> |
| リソースリスト | ❌ | ❌ |
| スクロールトップボタン | ❌ | ❌ |
| セレクトボックス v2 | ✅ select | ✅ <Select> |
| テーブル v2 | ✅ table | ✅ <Table> |
| テキストエリア v2 | ✅ textarea | ✅ <Textarea> |
| インプットテキスト v2 | ✅ inputText | ✅ <InputText> |
| ユーティリティリンク v2 | ✅ utilityLink | ✅ <UtilityLink> |