{"id":13880874,"url":"https://github.com/ebs-integrator/ebs-design","last_synced_at":"2026-01-16T13:33:01.977Z","repository":{"id":40486731,"uuid":"303318773","full_name":"ebs-integrator/ebs-design","owner":"ebs-integrator","description":"A React-based UI toolkit for enterprise grade applications","archived":false,"fork":false,"pushed_at":"2022-11-09T14:09:18.000Z","size":21303,"stargazers_count":251,"open_issues_count":3,"forks_count":12,"subscribers_count":7,"default_branch":"development","last_synced_at":"2025-07-07T13:41:01.694Z","etag":null,"topics":["design-system","design-systems","react","reactjs","typescript","ui-components","uikit"],"latest_commit_sha":null,"homepage":"https://ebs-integrator.github.io/ebs-design/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ebs-integrator.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-10-12T07:56:55.000Z","updated_at":"2024-12-10T09:04:31.000Z","dependencies_parsed_at":"2023-01-21T04:52:20.956Z","dependency_job_id":null,"html_url":"https://github.com/ebs-integrator/ebs-design","commit_stats":null,"previous_names":["ebs-integrator/react-ebs-ui"],"tags_count":135,"template":false,"template_full_name":null,"purl":"pkg:github/ebs-integrator/ebs-design","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ebs-integrator%2Febs-design","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ebs-integrator%2Febs-design/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ebs-integrator%2Febs-design/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ebs-integrator%2Febs-design/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ebs-integrator","download_url":"https://codeload.github.com/ebs-integrator/ebs-design/tar.gz/refs/heads/development","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ebs-integrator%2Febs-design/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265527547,"owners_count":23782480,"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":["design-system","design-systems","react","reactjs","typescript","ui-components","uikit"],"created_at":"2024-08-06T08:03:34.355Z","updated_at":"2026-01-16T13:33:01.946Z","avatar_url":"https://github.com/ebs-integrator.png","language":"TypeScript","funding_links":[],"categories":["TypeScript","UI Components"],"sub_categories":["React"],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://i.ibb.co/J260f5z/ebs-design.png\"\u003e\n\u003c/p\u003e\n\n\u003ch1 align=\"center\"\u003eEBS Design System\u003c/h1\u003e\n\n\u003cdiv align=\"center\"\u003e\n\nA React-based UI toolkit for **enterprise grade applications**\n\n[![NPM version][npm-image]][npm-url]\n[![NPM downloads][download-image]][download-url]\n[![Discussions][discussions-image]][discussions-url]\n\n\u003c/div\u003e\n\n[![Elements][elements-image]][elements-url]\n\n[npm-image]: http://img.shields.io/npm/v/ebs-design.svg?style=flat-square\n[npm-url]: http://npmjs.org/package/ebs-design\n[logo-image]: https://i.ibb.co/J260f5z/ebs-design.png\n[elements-image]: https://i.ibb.co/gMSWhYM/Elements-1.png\n[elements-url]: https://ebs-integrator.github.io/ebs-design/\n[download-image]: https://img.shields.io/npm/dm/ebs-design.svg?style=flat-square\n[download-url]: https://npmjs.org/package/ebs-design\n[discussions-image]: https://img.shields.io/badge/discussions-on%20github-blue?style=flat-square\n[discussions-url]: https://github.com/ebs-integrator/ebs-design/discussions\n\n## 🔥 Motivation\n\nFirst of all, **ebs-design** started as an internal tool to be a single pattern for enterprise application development, improving the experience of users in our products by using enhanced components. Now designers and developers use the same style for applications such as Administration panels, CRMs, HRMs, Finance and Accounting Apps, Analytics Dashboards, etc. \n\nWe are focused on creating rich components like forms, tables, modals, etc that add an exceptional experience in the most sophisticated apps.\n\n## ⚠️ WARNING\n\nThe UI Kit is UNDER DEVELOPMENT, we don't recommend using it in production projects until at least RC will be released. We are working on improving and refactoring. If you find  a problem, please create an Issue or PR with your change, will be glad to help. \n\nClick **Watch** and **Star** to get breaking news about project development.\n\n## 🧾 Documentation\n\nFor more usage details visit [Storybook](https://ebs-integrator.github.io/ebs-design/) and [Website](https://ebs.io/design/)\n\n## ⭐ Features\n\n- Designed for enterprise apps.\n- Modern design and exceptional user experience.\n- Fully customizable components using variables.\n- Written in TypeScript with predictable static types.\n- High-quality and performant React components.\n- 100% Open Source.\n\n## 📦 Installation\n\nUse the package manager [yarn](https://classic.yarnpkg.com/en/docs/install/#debian-stable) or npm to install library.\n\n\u003ca href=\"https://www.npmjs.com/package/ebs-design\"\u003e\u003cimg width=\"415px\" src=\"https://nodei.co/npm/ebs-design.png?downloads=true\u0026downloadRank=true\u0026stars=true\" /\u003e\u003c/a\u003e\n\n```\nnpm install ebs-design\n```\n\n#### ⚠️ Peer Dependencies\n\n| Package's name | Version        |\n| -------------- | -------------- |\n| react          | \u003e= 16.8        |\n| react-dom      | \u003e= 16.8        |\n| sass           | \u003e= 1.x         |\n\n## 🏗️ Usage guide\n\n```javascript\nimport { Button } from 'ebs-design';\n```\n\nImport styles scss into a `src/App.(js|tsx)`\n\n```javascript\nimport 'ebs-design/dist/styles/index.scss';\n```\n\nOr create and import your scss to customize variables\n\n```javascript\nimport './variables.scss';\n```\n\n```scss\n// Main colors\n$primary-color: #3366ff;\n$success-color: #2ac952;\n$info-color: #3bc0f9;\n$warning-color: #ffd83d;\n$danger-color: #ff3a30;\n$normal-color: #a5a5a5;\n\n// Primary colors\n$primary-000: #eef5ff;\n$primary-100: #d6e4ff;\n$primary-200: #adc8ff;\n$primary-300: #85a9ff;\n$primary-400: #6690ff;\n$primary-600: #254eda;\n$primary-700: #1a39b6;\n$primary-800: #102693;\n$primary-900: #0a1a7a;\n\n@import 'ebs-design/dist/styles/index.scss';\n```\n\n#### Additional styles import\n\n```javascript\nimport 'ebs-design/dist/styles/default.scss';\n```\n\n```scss\n// Default styles\n$font-size-base: 14px;\n$font-size-desktop: 12.5px;\n$font-size-small-desktop: 10px;\n\n$line-height-base: 1.414;\n$text-color: #494f7d;\n\n$h1-font-size: $font-size-base * 2.5;\n$h2-font-size: $font-size-base * 2;\n$h3-font-size: $font-size-base * 1.75;\n$h4-font-size: $font-size-base * 1.5;\n$h5-font-size: $font-size-base * 1.25;\n$h6-font-size: $font-size-base;\n```\n\n```javascript\nimport 'ebs-design/dist/styles/scrollbar.scss';\n```\n\n```scss\n// Default base size \u0026 colors of scrollbar\n$scrollbar-size: 8px;\n$scrollbar-track-background-color: $background-content;\n$scrollbar-thumb-background-color: $border-color;\n$scrollbar-thumb-hover-background-color: var(--primary-color);\n```\n\n## ❤️ Contributing\n\nPull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.\n\nPlease make sure to update tests as appropriate.\n\n## License\n\n[MIT](https://choosealicense.com/licenses/mit/)\n\n## Z-Indexes\n\n1. Mask 990\n2. Select dropdown 999\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Febs-integrator%2Febs-design","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Febs-integrator%2Febs-design","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Febs-integrator%2Febs-design/lists"}