{"id":13495519,"url":"https://github.com/gravity-ui/uikit","last_synced_at":"2026-04-27T11:01:10.103Z","repository":{"id":37084408,"uuid":"426239986","full_name":"gravity-ui/uikit","owner":"gravity-ui","description":null,"archived":false,"fork":false,"pushed_at":"2026-04-24T16:02:18.000Z","size":177811,"stargazers_count":970,"open_issues_count":145,"forks_count":148,"subscribers_count":13,"default_branch":"main","last_synced_at":"2026-04-24T16:33:50.682Z","etag":null,"topics":["desing-system","gravity-ui","react","react-components"],"latest_commit_sha":null,"homepage":"https://gravity-ui.com","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/gravity-ui.png","metadata":{"files":{"readme":"README-ru.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":"CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":"AGENTS.md","dco":null,"cla":null}},"created_at":"2021-11-09T13:28:54.000Z","updated_at":"2026-04-23T00:38:45.000Z","dependencies_parsed_at":"2023-11-28T23:27:09.881Z","dependency_job_id":"7c81a3dd-bd23-476f-8372-863ec09555b3","html_url":"https://github.com/gravity-ui/uikit","commit_stats":{"total_commits":458,"total_committers":85,"mean_commits":"5.3882352941176475","dds":0.7947598253275109,"last_synced_commit":"d93b1af5e01870297474a97bb0e29c1dbf9a851c"},"previous_names":["yandex-cloud/uikit"],"tags_count":332,"template":false,"template_full_name":null,"purl":"pkg:github/gravity-ui/uikit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gravity-ui","download_url":"https://codeload.github.com/gravity-ui/uikit/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32333199,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-26T23:26:28.701Z","status":"online","status_checked_at":"2026-04-27T02:00:06.769Z","response_time":128,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["desing-system","gravity-ui","react","react-components"],"created_at":"2024-07-31T19:01:35.525Z","updated_at":"2026-04-27T11:01:10.079Z","avatar_url":"https://github.com/gravity-ui.png","language":"TypeScript","readme":"# UIKit \u0026middot; [![npm package](https://img.shields.io/npm/v/@gravity-ui/uikit?logo=npm)](https://www.npmjs.com/package/@gravity-ui/uikit) [![CI](https://img.shields.io/github/actions/workflow/status/gravity-ui/uikit/.github/workflows/ci.yml?branch=main\u0026label=CI\u0026logo=github)](https://github.com/gravity-ui/uikit/actions/workflows/ci.yml?query=branch:main) [![storybook tests](https://img.shields.io/github/actions/workflow/status/gravity-ui/uikit/.github/workflows/test-storybook.yml?label=Storybook%20Tests\u0026logo=github)](https://github.com/gravity-ui/uikit/actions/workflows/test-storybook.yml) [![storybook](https://img.shields.io/badge/Storybook-deployed-ff4685?logo=storybook)](https://preview.gravity-ui.com/uikit/)\n\nНабор гибких, универсальных и высокоэффективных React-компонентов для создания сложных веб-приложений.\n\n\u003c!--GITHUB_BLOCK--\u003e\n\n![Cover image](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/uikit_cover.png)\n\n## Ресурсы\n\n### ![Globe Logo Light](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/globe_light.svg#gh-light-mode-only) ![Globe Logo Dark](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/globe_dark.svg#gh-dark-mode-only) [Веб-сайт](https://gravity-ui.com)\n\n### ![Documentation Logo Light](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/book-open_light.svg#gh-light-mode-only) ![Documentation Logo Dark](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/book-open_dark.svg#gh-dark-mode-only) [Документация](https://gravity-ui.com/components/uikit/alert)\n\n### ![Figma Logo Light](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/figma_light.svg#gh-light-mode-only) ![Figma Logo Dark](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/figma_dark.svg#gh-dark-mode-only) [Figma](\u003chttps://www.figma.com/community/file/1271150067798118027/Gravity-UI-Design-System-(Beta)\u003e)\n\n### ![Themer Logo Light](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/bucket-paint_light.svg#gh-light-mode-only) ![Themer Logo Dark](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/bucket-paint_dark.svg#gh-dark-mode-only) [Themer](https://gravity-ui.com/themer)\n\n### ![Storybook Logo Light](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/storybook_light.svg#gh-light-mode-only) ![Storybook Logo Dark](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/storybook_dark.svg#gh-dark-mode-only) [Storybook](https://preview.gravity-ui.com/uikit/)\n\n### ![Community Logo Light](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/telegram_light.svg#gh-light-mode-only) ![Community Logo Dark](https://raw.githubusercontent.com/gravity-ui/uikit/main/docs/assets/telegram_dark.svg#gh-dark-mode-only) [Сообщество](https://t.me/gravity_ui)\n\n\u003c!--/GITHUB_BLOCK--\u003e\n\n## Установка\n\n```shell\nnpm install --save-dev @gravity-ui/uikit\n```\n\n## Использование\n\n```jsx\nimport {Button} from '@gravity-ui/uikit';\n\nconst SubmitButton = \u003cButton view=\"action\" size=\"l\" /\u003e;\n```\n\n### Стили\n\nUIKit включает в себя базовое стилизованное оформление и тему. Чтобы подключить их, добавьте следующий фрагмент кода в начало точки входа приложения:\n\n```js\n// index.js\n\nimport '@gravity-ui/uikit/styles/fonts.css';\nimport '@gravity-ui/uikit/styles/styles.css';\n\n// ...\n```\n\nUIKit поддерживает несколько тем: светлая, темная и их контрастные версии. Приложение должно быть отрисовано внутри компонента `ThemeProvider`:\n\n```js\nimport {createRoot} from 'react-dom/client';\nimport {ThemeProvider} from '@gravity-ui/uikit';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(\n  \u003cThemeProvider theme=\"light\"\u003e\n    \u003cApp /\u003e\n  \u003c/ThemeProvider\u003e,\n);\n```\n\nДля предотвращения мигания темы можно сгенерировать исходные CSS-классы для корневого элемента во время серверного рендеринга.\n\n```js\nimport {getRootClassName} from '@gravity-ui/uikit/server';\n\nconst theme = 'dark';\nconst rootClassName = getRootClassName({theme});\n\nconst html = `\n\u003chtml\u003e\n  \u003cbody\u003e\n    \u003cdiv id=\"root\" class=\"${rootClassName}\"\u003e\u003c/div\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n`;\n```\n\nТакже предусмотрен файл с SCSS-[миксинами](styles/mixins.scss), которые можно использовать в приложении.\n\n### I18N\n\nНекоторые компоненты содержат текстовые токены (слова и фразы), доступные на двух языках: `en` (по умолчанию) и `ru`.\nДля настройки языка используйте функцию `configure`:\n\n```js\n// index.js\n\nimport {configure} from '@gravity-ui/uikit';\n\nconfigure({\n  lang: 'ru',\n});\n```\n\n## Разработка\n\nДля запуска Storybook в режиме разработки выполните следующую команду:\n\n```shell\nnpm start\n```\n","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravity-ui%2Fuikit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgravity-ui%2Fuikit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravity-ui%2Fuikit/lists"}