{"id":19950945,"url":"https://github.com/db-ui/mono","last_synced_at":"2026-02-09T06:34:23.817Z","repository":{"id":277768783,"uuid":"932042568","full_name":"db-ui/mono","owner":"db-ui","description":null,"archived":false,"fork":false,"pushed_at":"2025-02-13T09:41:23.000Z","size":3,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-11-23T03:12:01.922Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/db-ui.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-02-13T09:16:37.000Z","updated_at":"2025-02-13T09:17:16.000Z","dependencies_parsed_at":null,"dependency_job_id":"927d93ac-1357-46c7-a6ba-77d69d9a34f8","html_url":"https://github.com/db-ui/mono","commit_stats":null,"previous_names":["db-ui/mono"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/db-ui/mono","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/db-ui%2Fmono","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/db-ui%2Fmono/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/db-ui%2Fmono/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/db-ui%2Fmono/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/db-ui","download_url":"https://codeload.github.com/db-ui/mono/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/db-ui%2Fmono/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29258225,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-09T04:11:57.159Z","status":"ssl_error","status_checked_at":"2026-02-09T04:11:56.117Z","response_time":56,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["a11y","accessibility","angular","components","css","design-system","html","mitosis","nextjs","react","scss","tailwindcss","vue"],"created_at":"2024-11-13T01:06:10.179Z","updated_at":"2026-02-09T06:34:23.803Z","avatar_url":"https://github.com/db-ui.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003c!-- markdownlint-configure-file { \"MD013\": false, \"MD041\":false } --\u003e\n\u003c!-- markdownlint-disable MD033 MD010 --\u003e\n\n\u003cpicture\u003e\u003csource srcset=\"https://db-ui.github.io/images/db-ux-design-system-v3-header.avif\" type=\"image/avif\"\u003e\u003csource srcset=\"https://db-ui.github.io/images/db-ux-design-system-v3-header.webp\" type=\"image/webp\"\u003e\u003cimg src=\"https://db-ui.github.io/images/db-ux-design-system-v3-header.jpg\" alt=\"\"\u003e\u003c/picture\u003e\n\n# DB UI Mono (Beta) 🚂💖\n\n![Part of DB UX Design System (Version 3)](https://img.shields.io/badge/Part%20of-DB%20UX%20Design%20System%20v3-d7dce1.svg)\n![Main pipeline](https://github.com/db-ui/mono/actions/workflows/default.yml/badge.svg)\n![Apache 2.0 license badge](https://img.shields.io/badge/License-Apache_2.0-blue.svg)\n[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)\n[![XO code style](https://img.shields.io/badge/code_style-XO-5ed9c7.svg)](https://github.com/xojs/xo)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)\n[![Contributor Covenant](https://img.shields.io/badge/Contributor%20Covenant-2.0-4baaaa.svg)](CODE-OF-CONDUCT.md)\n\nDB UI Mono provides robust HTML UI components, reusable visual styles, and powerful tooling to help developers,\ndesigners, and content authors build, maintain, and scale best of class digital experiences.\n\n\u003cfigure\u003e\n\t\u003ccite\u003eWe’re not designing pages anymore. We’re designing systems of components.\u003c/cite\u003e\n\t\u003cfigcaption\u003e\u003ca href=\"https://bradfrost.com/blog/post/bdconf-stephen-hay-presents-responsive-design-workflow/\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eStephen Hay\u003c/a\u003e. \u003ca href=\"https://vimeo.com/67476280\" title=\"Brad Frosts at beyond tellerrand conference regarding Atomic Design\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eCited in a talk by Brad Frost at beyond tellerrand conference.\u003c/a\u003e\u003c/figcaption\u003e\n\u003c/figure\u003e\n\n## Packages\n\n| Package                                                                     | Content                             | Version                                                                                                                                                                                                                                                                                  |\n| --------------------------------------------------------------------------- | ----------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| [foundations](https://github.com/db-ui/mono/tree/main/packages/foundations) | CSS/SCSS/Tailwind styles and assets | [![@db-ui/foundations on Npmjs](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fapi.github.com%2Frepos%2Fdb-ui%2Fmono%2Freleases%2Flatest\u0026query=%24.tag_name\u0026label=npm\u0026color=ed1c24 \"npm version\")](https://npmjs.com/package/@db-ui/foundations \"DB UI – on NPM\")           |\n| [components](https://github.com/db-ui/mono/tree/main/packages/components)   | CSS/SCSS styles for components      | [![@db-ui/components on Npmjs](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fapi.github.com%2Frepos%2Fdb-ui%2Fmono%2Freleases%2Flatest\u0026query=%24.tag_name\u0026label=npm\u0026color=ed1c24 \"npm version\")](https://npmjs.com/package/@db-ui/components \"DB UI – on NPM\")             |\n| [ngx-components](https://github.com/db-ui/mono/tree/main/output/angular)    | Native Angular components           | [![@db-ui/ngx-components on Npmjs](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fapi.github.com%2Frepos%2Fdb-ui%2Fmono%2Freleases%2Flatest\u0026query=%24.tag_name\u0026label=npm\u0026color=ed1c24 \"npm version\")](https://npmjs.com/package/@db-ui/ngx-components \"DB UI – on NPM\")     |\n| [react-components](https://github.com/db-ui/mono/tree/main/output/react)    | Native React components             | [![@db-ui/react-components on Npmjs](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fapi.github.com%2Frepos%2Fdb-ui%2Fmono%2Freleases%2Flatest\u0026query=%24.tag_name\u0026label=npm\u0026color=ed1c24 \"npm version\")](https://npmjs.com/package/@db-ui/react-components \"DB UI – on NPM\") |\n| [v-components](https://github.com/db-ui/mono/tree/main/output/vue)          | Native Vue 3 components             | [![@db-ui/v-components on Npmjs](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fapi.github.com%2Frepos%2Fdb-ui%2Fmono%2Freleases%2Flatest\u0026query=%24.tag_name\u0026label=npm\u0026color=ed1c24 \"npm version\")](https://npmjs.com/package/@db-ui/v-components \"DB UI – on NPM\")         |\n| [web-components](https://github.com/db-ui/mono/tree/main/output/stencil)    | Web Components                      | [![@db-ui/web-components on Npmjs](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fapi.github.com%2Frepos%2Fdb-ui%2Fmono%2Freleases%2Flatest\u0026query=%24.tag_name\u0026label=npm\u0026color=ed1c24 \"npm version\")](https://npmjs.com/package/@db-ui/web-components \"DB UI – on NPM\")     |\n\n## How to use\n\nInstall your preferred package via npm or yarn e.g. `npm i @db-ui/react-components`.\n\nAfterwards you need to add the specific CSS or SCSS files to provide the styles of DB UX Design System (Version 3).\nFor a detailed overview look at our [examples](https://github.com/db-ui/examples).\n\n## Components\n\nWe maintain a [status overview](https://github.com/orgs/db-ui/projects/4/views/3) for all components.\n\n## Core principals\n\n\u003cdetails\u003e\n  \u003csummary\u003e\u003cstrong\u003e\n\tConsistent \u0026 Compliant\n\t\u003c/strong\u003e\u003c/summary\u003e\n\nDB UI Mono is part of [DB UX Design System Core](https://marketingportal.extranet.deutschebahn.com/marketingportal/Design-Anwendungen/DB-UX-Design-System/Design-fuer-Apps-Web/UI-Komponenten),\nthat are the guidelines for any Personenverkehr Customer and Deutsche Bahn Enterprise website and web applications.\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\u003cstrong\u003eAccessible\u003c/strong\u003e\u003c/summary\u003e\n\nDB UI Mono leverages semantic HTML, ARIA roles, states and properties to apply our styles wherever possible, thus\nenforcing correct, accessible markup. And we're quality checking this in partnership with\nthe [Team Digital Accessibility](https://db.de/8pei5n).\n\n\u003c/details\u003e\n\u003cdetails\u003e\n  \u003csummary\u003e\u003cstrong\u003eDeclarative\u003c/strong\u003e\u003c/summary\u003e\n\nDB UI Mono uses declarative selectors instead of visual helpers to ensure our HTML class names and structure are human\nread- and understandable, lean, performant and so much easier to update.\n\n\u003c/details\u003e\n\u003cdetails\u003e\n  \u003csummary\u003e\u003cstrong\u003eEvergreen\u003c/strong\u003e\u003c/summary\u003e\n\nAs [DB UX Design System](https://marketingportal.extranet.deutschebahn.com/marketingportal/Design-Anwendungen/DB-UX-Design-System/Design-fuer-Apps-Web/UI-Komponenten) evolves, so does DB UI\nMono, meaning apps only need to keep their DB UI Mono package updated to ensure the latest look and feel.\n\n\u003c/details\u003e\n\n## Things to keep in mind\n\n### Developed for and driven by the community\n\nThis is mainly a platform providing the space and technology for a common basis of curated components; their development\nis mainly driven by the community and adapted out of the work done in projects and through the huge amount of feedback\nthat we're gaining out of the community. So please support us in any way possible, this is greatly appreciated!\n\n## Migration\n\n### From DB UI Core or DB UI Elements to DB UI Mono\n\nWe're providing a detailed migration for each component next to the documentation of each component:\n\u003chttps://db-ui.github.io/mono/review/main/components/action/button/migration\u003e\n\n### In between DB UI Mono versions\n\nCheck our migration docs for breaking changes:\n\n1. [Alpha ➡ Beta](https://github.com/db-ui/mono/tree/main/docs/migration/alpha-beta.md) (0.0.x➡0.x.x)\n2. [v0.2 ➡ v0.3](https://github.com/db-ui/mono/tree/main/docs/migration/v0.2.x-to-v0.3.x.md)\n3. [v0.3 ➡ v0.4](https://github.com/db-ui/mono/tree/main/docs/migration/v0.3.x-to-v0.4.x.md)\n4. v0.4 ➡ v0.5: no migration needed, no breaking changes\n5. [v0.5 ➡ v0.6](https://github.com/db-ui/mono/tree/main/docs/migration/v0.5.x-to-v0.6.x.md)\n\n## How to start develop / contribute\n\n```shell\nnpm install\nnpm run build\nnpm run start\n```\n\nPlease mind the [conventions for git commits](/docs/conventions.adoc#user-content-git-commits-conventions).\n\n### Versions\n\nAll versions in all `package.json` files are set to `0.0.0`, we change those during release process in CI/CD.\n\n\u003c!-- markdownlint-disable MD026 --\u003e\n\n## Give us your feedback!\n\n\u003c!-- markdownlint-disable MD026 --\u003e\n\n\u003c!-- markdownlint-disable MD033 --\u003e\n\nThis is only the first version of our framework and we really want your feedback - either within\nthe \u003ca href=\"https://db.de/krnm74\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eDB UI Channel by Web Dev Community in\nMicrosoft Teams (only available DB internally)\u003c/a\u003e, or directly\nat [db-ux-designsystem@deutschebahn.com](mailto:db-ux-designsystem@deutschebahn.com). \u003c!-- markdownlint-disable MD033 --\u003e\nWe're particularly keen to add as many examples to the behaviours as possible, to further clarify them.\n\n## Deutsche Bahn brand\n\nAs we'd like to perfectly support our users and customers on their digital journey, the usage of Deutsche Bahn brand and\ntrademarks are bound to clear guidelines and restrictions even when being used with the code that we're providing with\nthis product; Deutsche Bahn fully reserves all rights and ownership regarding the Deutsche Bahn brand, even though that\nwe're providing the code of DB UI products free to use and release it under the Apache 2.0 license.\nPlease have a look at our brand portal at \u003chttps://marketingportal.extranet.deutschebahn.com/\u003e for any further questions\nand whom to contact on any brand issues. As these assets and visual guidelines are retrieved from our Deutsche Bahn\nMarketingportal, you'll agree with\nthe [\"Allgemeine Nutzungsbedingungen für das DB-Marketingportal\" (german)](https://marketingportal.extranet.deutschebahn.com/marketingportal/Nutzungsbedingungen-9702684#)\nin case of using them.\n\nFor any usage outside of Deutsche Bahn websites and applications you must remove or replace any Deutsche Bahn brand and\ndesign assets as well as protected characteristics and trademarks. We're even also planning to provide a neutral theme\nthat would make it much easier for you to use our product without the trademarks by Deutsche Bahn.\n\nThis especially relates to the files in the directories `packages/foundations/assets/fonts`, `packages/foundations/assets/images` and `packages/foundations/assets/favicon.ico` as well.\n\n## Development\n\nIf you're working as a developer on the DB UX Design System, please have a look at the relevant [documentation](docs/development.md).\n\n## Contributions\n\nContributions are very welcome, please refer to the [contribution guide](https://github.com/db-ui/mono/blob/main/CONTRIBUTING.md).\n\n## Code of conduct\n\nWe as members, contributors, and leaders pledge to make participation in our\ncommunity a harassment-free experience for everyone – have a look at\nour [Contributor Covenant Code of Conduct](https://github.com/db-ui/mono/blob/main/CODE-OF-CONDUCT.md).\n\n## License\n\nThis project is licensed under [Apache-2.0](LICENSE), Copyright 2024 by DB Systel GmbH.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdb-ui%2Fmono","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdb-ui%2Fmono","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdb-ui%2Fmono/lists"}