{"id":14965825,"url":"https://github.com/decathlon/vitamin-web","last_synced_at":"2025-10-03T21:46:00.538Z","repository":{"id":37441688,"uuid":"322056386","full_name":"Decathlon/vitamin-web","owner":"Decathlon","description":"Decathlon Design System UI components for web applications","archived":false,"fork":false,"pushed_at":"2024-12-11T10:59:17.000Z","size":25990,"stargazers_count":286,"open_issues_count":10,"forks_count":77,"subscribers_count":14,"default_branch":"main","last_synced_at":"2025-05-08T03:06:19.187Z","etag":null,"topics":["accessibility","components","css","decathlon","design-system","design-tokens","html","lerna","libraries","monorepo","nx","showcases","storybook","styleguide","tailwindcss","ui-components","ui-kit","ui-library","vitamin","yarn"],"latest_commit_sha":null,"homepage":"https://decathlon.github.io/vitamin-web","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Decathlon.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-12-16T17:36:03.000Z","updated_at":"2025-04-02T07:18:05.000Z","dependencies_parsed_at":"2023-09-29T11:38:52.508Z","dependency_job_id":"3933ef1a-731a-417a-afb9-d86d0e1f0494","html_url":"https://github.com/Decathlon/vitamin-web","commit_stats":{"total_commits":1912,"total_committers":73,"mean_commits":26.19178082191781,"dds":0.7191422594142259,"last_synced_commit":"e78ec82bf582cea0f82f029a2b74610f30ff7e76"},"previous_names":[],"tags_count":3660,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Decathlon%2Fvitamin-web","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Decathlon%2Fvitamin-web/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Decathlon%2Fvitamin-web/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Decathlon%2Fvitamin-web/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Decathlon","download_url":"https://codeload.github.com/Decathlon/vitamin-web/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254149953,"owners_count":22022851,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["accessibility","components","css","decathlon","design-system","design-tokens","html","lerna","libraries","monorepo","nx","showcases","storybook","styleguide","tailwindcss","ui-components","ui-kit","ui-library","vitamin","yarn"],"created_at":"2024-09-24T13:35:26.010Z","updated_at":"2025-10-03T21:46:00.517Z","avatar_url":"https://github.com/Decathlon.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003e [!IMPORTANT]\n\u003e This current version of Vitamin will no longer evolve and only accept bug fixes from now on. [More details here](https://github.com/Decathlon/vitamin-design/blob/main/IMPORTANT_NOTE.md).\n\n\u003cbr /\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg\n    widt      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-navbar\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-navbar?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\"300px\"\n    src=\"https://user-images.githubusercontent.com/9600228/102414461-e3b92b00-3ff6-11eb-9c96-5f37c4d5e02c.png#gh-light-mode-only\"\n    alt=\"Vitamin Decathlon Design System logo\" /\u003e\n  \u003cimg\n    width=\"300px\"\n    src=\"https://user-images.githubusercontent.com/9600228/147513091-66fcc204-279b-4140-9be5-c16744c0f637.png#gh-dark-mode-only\"\n    alt=\"Vitamin Decathlon Design System logo\" /\u003e\n\u003c/p\u003e\n\n\u003ch1 align=\"center\"\u003eVitamin Web\u003c/h1\u003e\n\n\u003cp align=\"center\"\u003eDecathlon Design System libraries for web applications\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.decathlon.design\"\u003eWebsite\u003c/a\u003e - \u003ca href=\"https://decathlon.github.io/vitamin-web\"\u003eShowcases\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca aria-label=\"contributors graph\" href=\"https://github.com/decathlon/vitamin-web/graphs/contributors\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/contributors/decathlon/vitamin-web.svg\"\u003e\n  \u003c/a\u003e\n  \u003ca aria-label=\"last commit\" href=\"https://github.com/Decathlon/vitamin-web/commits\"\u003e\n    \u003cimg alt=\"\" src=\n  \"https://img.shields.io/github/last-commit/decathlon/vitamin-web.svg\"\u003e\n  \u003c/a\u003e\n  \u003ca aria-label=\"license\" href=\"https://github.com/decathlon/vitamin-web/blob/main/LICENSE\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/license/decathlon/vitamin-web.svg\" alt=\"\"\u003e\n  \u003c/a\u003e\n  \u003ca aria-label=\"GitHub Actions - Build main branch\" href=\"https://github.com/Decathlon/vitamin-web/actions\"\u003e\n    \u003cimg src=\"https://github.com/Decathlon/vitamin-web/workflows/Build%20main%20branch/badge.svg\" alt=\"\"\u003e\n  \u003c/a\u003e\n  \u003ca aria-label=\"slack\" href=\"https://join.slack.com/t/decathlon-design/shared_invite/zt-13kxb50ar-iHzqV~Olsu4~NCkEPj5c4g\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/slack-Decathlon%20Design%20System-purple.svg?logo=slack\" alt=\"\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n## Introduction\n\n[Decathlon Design System](https://decathlon.design) is the framework that helps our ecosystem to design and develop consistent and quality experiences. For its [Digital section](https://www.decathlon.design/726f8c765/p/6145b2-overview), it is called Vitamin.\n\nThis repository hosts libraries for web applications.\n\n## Core packages\n\nIn order to allow you to consume the elements of the Design System **according to your product constraints**, we give you the possibility of using the Vitamin web libraries with **different technologies \u0026 levels of granularity** with core packages developed and maintained by the Vitamin core team.\n\n### Global CSS styles 🎨\n\nThis package provides you with a complete CSS with a huge set of utility classes as it is generated with [Tailwind CSS](https://tailwindcss.com). Then it will be up to you to [optimize for production](https://purgecss.com/) by purging the CSS according to the classes used in your HTML:\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth\u003e@vtmn/css\u003c/th\u003e\n    \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\nIf you already using [Tailwind CSS](https://tailwindcss.com/) in your project or you want to take full advantage of all its features like [functions \u0026 directives](https://tailwindcss.com/docs/functions-and-directives) by building your own classes via [`@apply`](https://tailwindcss.com/docs/functions-and-directives#apply) for example. You can check our package [`@vtmn/css-tailwind-preset`](https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/presets/tailwind#readme) which will explain you how to use Vitamin styles in a Tailwind CSS project.\n\n### Specific CSS styles 🖌\n\nThese packages allow the consumption of elements with a higher level of granularity. You get only the styles you need and what you consume is Pure CSS without [CSS Custom Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/--*), therefore IE 11 compatible:\n\n\u003cdetails\u003e\n  \u003csummary\u003eFor design tokens\u003c/summary\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-design-tokens\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/design-tokens#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/index.html?path=/story/guidelines-colors--page\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-design-tokens\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-design-tokens?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003eFor each component\u003c/summary\u003e\n\n  \u003ch4\u003eActions\u003c/h4\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-button\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/actions/button#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/8008f8-button\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-actions-button--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-button\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-button?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-dropdown\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/actions/dropdown#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/v/0/p/42d824-dropdown\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-actions-dropdown--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-dropdown\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-dropdown?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n     \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-link\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/actions/link#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/086ae8-link\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-actions-link--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-link\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-link?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\n  \u003ch4\u003eForms\u003c/h4\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-select\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/forms/select#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/46ee45-select-beta/b/136a45\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-forms-select--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-select\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-select?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-text-input\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/forms/text-input#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/31121d-text-input\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-forms-text-input--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-text-input\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-text-input?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\n  \u003ch4\u003eIndicators\u003c/h4\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-badge\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/indicators/badge#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/465f7c-badge-beta\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-indicators-badge--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-badge\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-badge?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-loader\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/indicators/loader#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/09b561-loader-beta/b/32cf1b\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-indicators-loader--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-loader\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-loader?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-price\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/indicators/price#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/v/0/p/81e6be-price-beta\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-indicators-price--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-price\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-price?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-progressbar\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/indicators/progressbar#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/2388f2-progressbar-beta\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-indicators-progressbar--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-progressbar\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-progressbar?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-rating\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/indicators/rating#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/19ec87-rating-beta/b/5496b9\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-indicators-rating--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-rating\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-rating?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-tag\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/indicators/tags#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/v/0/p/129f57-tag-beta\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-indicators-tag--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-tag\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-tag?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\n  \u003ch4\u003eNavigation\u003c/h4\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-breadcrumb\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/navigation/breadcrumb#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/v/0/p/95fc13-breadcrumb\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-navigation-breadcrumb--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-breadcrumb\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-breadcrumb?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-navbar\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/navigation/navbar#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/9596dd-navbar-beta/b/08a8f6\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-navigation-navbar--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-navbar\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-navbar?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-search\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/navigation/search#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/v/0/p/666649-search-beta/b/711780\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-navigation-search--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-search\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-search?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-tabs\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/navigation/tabs#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/705308-tabs-beta/b/4177c3\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-navigation-tabs--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-tabs\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-tabs?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\n  \u003ch4\u003eOverlays\u003c/h4\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-alert\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/overlays/alert#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/64b4b5-alert-beta/b/129609\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-overlays-alert--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-alert\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-alert?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-modal\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/overlays/modal#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/9596dd-modal-beta/b/08a8f6\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-overlays-modal--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-modal\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-modal?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-popover\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/overlays/popover#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/3086dd-popover-beta/b/129609\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-overlays-popover--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-popover\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-popover?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-snackbar\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/overlays/snackbar#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/798580-snackbar-beta/b/129609\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-overlays-snackbar--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-snackbar\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-snackbar?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-toast\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/overlays/toast#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/4450b2-toast-beta/b/129609\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-overlays-toast--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-toast\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-toast?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-tooltip\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/overlays/tooltip#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/595266-tooltip-beta/b/97ce1d\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-overlays-tooltip--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-tooltip\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-tooltip?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\n  \u003ch4\u003eSelection controls\u003c/h4\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-checkbox\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/selection-controls/checkbox#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/953c37-checkbox\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-selection-controls-checkbox--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-checkbox\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-checkbox?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-chip\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/selection-controls/chip#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/953c37-chip\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-selection-controls-chip--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-chip\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-chip?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-quantity\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/selection-controls/quantity#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/v/0/p/207abd-quantity-beta/b/75bea6\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-selection-controls-quantity--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-quantity\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-quantity?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-radio-button\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/selection-controls/radio-button#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/31e934-radio-button\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-selection-controls-radio-button--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-radio-button\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-radio-button?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-toggle\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/selection-controls/toggle#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/99628d-toggle\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-selection-controls-toggle--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-toggle\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-toggle?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\n  \u003ch4\u003eStructure\u003c/h4\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-accordion\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/structure/accordion#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/v/0/p/04348b-accordion-beta\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-structure-accordion--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-accordion\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-accordion?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-card\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/structure/card#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/88fc2b-card-beta/b/51e109\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-structure-card--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-card\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-card?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-divider\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/structure/divider#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/28ad9b-divider-beta/b/75bea6\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-structure-divider--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-divider\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-divider?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-list\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/structure/list#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/078570-list-beta/b/9115e7\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-structure-list--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-list\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-list?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-skeleton\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/components/structure/skeleton#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/79685a-skeleton-beta/b/122d98\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/?path=/docs/components-structure-skeleton--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-skeleton\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-skeleton?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n \u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003eFor utilities\u003c/summary\u003e\n\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003cth\u003e@vtmn/css-utilities\u003c/th\u003e\n      \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/utilities#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-css/index.html?path=/docs/guidelines-typography--overview\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-css-d891bc?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n      \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/css-utilities\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/css-utilities?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\u003c/details\u003e\n\n### Icons ✨\n\nThis package provides you with a library of SVG icons that you can include in a handful of ways _(SVGs, icon font, sprite, CSS, embedded)_:\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth\u003e@vtmn/icons\u003c/th\u003e\n    \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/icons#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/91dc94-iconography\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-icons\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-icons-295573?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/icons\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/icons?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n### Assets 🏞\n\nThis package provides you with a library of SVG assets that you can include in a handful of ways _(SVGs, asset font, sprite, CSS, embedded)_:\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth\u003e@vtmn/assets\u003c/th\u003e\n    \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/assets#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.decathlon.design/726f8c765/p/895daa-assets\"\u003e\u003cimg src=\"https://img.shields.io/badge/decathlon.design-docs-007dbc\" alt=\"documentation\" /\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/assets\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/assets?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n## Community packages\n\nIn order to enhance your Developer eXperience, we give you the possibility to develop your components in React, Svelte and Vue based on our core packages just above. These libraries are developed and maintained by the community, the Vitamin core team will be there to review, and ensure the quality of your propositions, feel free to contribute!\n\n### React 🔵\n\nThis package provides you with a library of [React](https://reactjs.org/) components:\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth\u003e@vtmn/react\u003c/th\u003e\n    \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/react#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-react\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-react-61DAFB?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/react\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/react?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n### Svelte 🟠\n\nThis package provides you with a library of [Svelte](https://svelte.dev/) Components:\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth\u003e@vtmn/svelte\u003c/th\u003e\n    \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/svelte#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-svelte\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-svelte-F13C03?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/svelte\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/svelte?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n### Vue 🟢\n\nThis package provides you with a library of [Vue](https://vuejs.org/) components:\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth\u003e@vtmn/vue\u003c/th\u003e\n    \u003ctd\u003e\u003ca href=\"https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/vue#readme\"\u003eREADME\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://decathlon.github.io/vitamin-web/@vtmn/showcase-vue\"\u003e\u003cimg src=\"https://img.shields.io/badge/storybook-vue-41B883?style=flat\u0026logo=storybook\" alt=\"storybook\" /\u003e\u003c/a\u003e\u003c/a\u003e\u003c/td\u003e\n    \u003ctd\u003e\u003ca href=\"https://www.npmjs.com/package/@vtmn/vue\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vtmn/vue?style=flat\u0026logo=npm\" alt=\"npm version\" /\u003e\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n## Contributing\n\nOne of the Decathlon Design System goals is to provide guidelines \u0026 components to gain in consistency, efficiency \u0026 accessibility. The best way to achieve this is together!\nThat's why we are on GitHub. We would love contributions from the community _(bug reports, feature requests, suggestions, Pull Requests, whatever you want!)_.\n\n[Yarn workspaces](https://yarnpkg.com/lang/en/docs/workspaces/) and [nx](https://nx.dev) are used to manage dependencies and build config across packages. [Lerna](https://github.com/lerna/lerna/) is used to manage versioning \u0026 publishing.\n\nRun the following to setup your local dev environment:\n\n```sh\n# Install `yarn`, alternatives at https://yarnpkg.com/en/docs/install\nbrew install yarn\n\n# Clone or fork `vitamin-web`\ngit clone git@github.com:Decathlon/vitamin-web.git # or your fork\ncd vitamin-web\n\n# install dependencies\nyarn\n\n# build all packages\nyarn build\n\n# start all showcases and build sources in watch mode \u0026 hot reload\nyarn start\n# or you can launch separately (recommended)\nyarn start:css\nyarn start:icons\nyarn start:react\nyarn start:svelte\nyarn start:vue\n```\n\n\u003e 👉 See [the contributing docs](CONTRIBUTING.md) for more information about how to contribute.\n\n## Special thanks\n\nThank you to the [contributors](CONTRIBUTORS.md) involved in these vitamin-web libraries _(even before they were Open Source)_. 💙\n\n\u003ca href=\"https://github.com/decathlon/vitamin-web/graphs/contributors\"\u003e\n  \u003cimg src=\"https://contrib.rocks/image?repo=decathlon/vitamin-web\" /\u003e\n\u003c/a\u003e\n\nThank you also [Remix Icon](https://remixicon.com) because Vitamix Icons is the official Decathlon icon library based on their [open-source icon library](https://github.com/Remix-Design/RemixIcon) (Remix Design © 2020). This original library is under the license Apache 2.0 and has been modified by Decathlon. [Learn more](https://www.decathlon.design/726f8c765/p/58575f-vitamix-license).\n\n## License\n\n    Copyright 2021 Decathlon.\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n       http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdecathlon%2Fvitamin-web","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdecathlon%2Fvitamin-web","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdecathlon%2Fvitamin-web/lists"}