# grommet/grommet

a react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package

Repository: https://github.com/grommet/grommet
Canonical: https://ross.abutalabs.com/products/grommet
Homepage: https://grommet.io
Language: JavaScript
License: Apache-2.0
License Family: permissive
Topics: grommet, javascript, ux-framework, babel, react, a11y, design-system, hacktoberfest
Last push: 2026-08-26T22:36:10+00:00

## Health v2 (maintenance only)
Score: 99/100 (v2, computed 2026-09-03T02:20:16.233290+00:00)
- activity 99, release rhythm 98, longevity 100
- inputs: {"age_days": 4180, "days_push": 7, "days_rel": 15, "gap_med": 28.5, "n_releases_24m": 21}
- flags: none
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 8352, forks 1036 (observed 2026-08-28T04:10:20.459873+00:00)

## What it is
Grommet is a React-based UI framework and design system that packages accessible, modular, responsive, and themeable components for building web applications. It emphasizes W3C WCAG 2.1 compliance, mobile-first responsive layouts via Flexbox and CSS Grid, and powerful theming tooling.

## Use cases
- build an accessible React user interface
- find a React component library with built-in theming
- create a responsive mobile-first web app UI
- adopt a design system for a React codebase
- make UI components WCAG compliant with keyboard and screen reader support
- kickstart a new React app with a starter template

## When to choose
- You need accessibility (WCAG 2.1, keyboard navigation, screen reader support) out of the box
- You want an opinionated, batteries-included design system with icons, templates, and designer tooling
- You need responsive Flexbox/CSS Grid layouts that work across phones and widescreen displays
- You want a mature, well-maintained library with an active community and release history

## When to avoid
- Your project is not built with React, since Grommet is React-only
- You want unstyled headless primitives or a utility-first CSS approach instead of an opinionated design system
- You need to match a fully bespoke visual language and the bundled theming model would fight your design requirements
- You want to avoid extra dependencies like styled-components

## Facets
- artifact type: framework
- maturity: stable
- function: ui-components, frontend-framework, accessibility, theme
- domain: web-development, frontend, accessibility, web-design
- platform: browser, cross-platform
- tags: react, design-system, component-library, styled-components, wcag-2-1, a11y, theming, responsive-design, mobile-first, ux-framework, nodejs

## Member repositories
- grommet/grommet (main) score 99

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:10:20.459873+00:00.
- Health v2: computed from the inputs above; adoption is never an input.
- Inferred fields (summary, facets, guidance): AI-extracted, prompt v1, taxonomy v1, on 2026-08-29T17:27:34.847236+00:00, confidence not recorded.
  - readme: https://github.com/grommet/grommet (fetched 2026-08-28T04:10:20.459873+00:00, sha 379b506ec8d6)
  - homepage: https://grommet.io (fetched 2026-08-29T08:27:53.423388+00:00, sha c81e588d282c)
  - site_page: https://v2.grommet.io/docs (fetched 2026-08-29T08:27:53.425961+00:00, sha 48bb92d00f2c)
- Data as of 2026-08-30T08:39:29.467469+00:00.
