# Web Awesome

Build better with Web Awesome, the open source library of web components from Font Awesome. Upgrade to Pro and ship websites faster!

Repository: https://github.com/shoelace-style/webawesome
Canonical: https://ross.abutalabs.com/products/web-awesome
Homepage: https://webawesome.com
Language: TypeScript
License: MIT
License Family: permissive
Topics: designsystems, opensource, webcomponents
Last push: 2026-09-02T20:31:19+00:00
Link (homepage): https://webawesome.com
Link (site_page): https://webawesome.com/docs
Link (site_page): https://webawesome.com/docs/usage
Link (site_page): https://webawesome.com/docs/form-controls
Link (site_page): https://webawesome.com/docs/localization

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

## Adoption (not part of the score)
Stars 1303, forks 189 (observed 2026-09-03T02:15:17.836848+00:00)

## What it is
Web Awesome (successor to Shoelace) is an open-source, framework-agnostic design system of 50+ accessible UI components built on standard web components (custom elements), with themes, CSS utilities, page layouts, and localization for 30+ languages. It works with any framework or plain HTML via CDN or npm, and ships AI-readable docs (agent skills and LLMs.txt) for coding assistants.

## Use cases
- add buttons, inputs, and dialogs to a plain HTML page via CDN
- use a consistent UI component library across React, Vue, Angular, and Svelte projects
- build accessible forms with client-side constraint validation
- theme a web app with light/dark mode and custom brand palettes
- localize UI components into multiple languages
- style native HTML elements to match a component library
- give an AI coding assistant context about component APIs

## When to choose
- you want framework-agnostic components that work with any stack or no framework
- you need accessible, customizable web components with strong theming support
- you want to drop a UI library in via a single CDN script tag
- you're migrating from Shoelace and want its actively developed successor

## When to avoid
- you need a full SPA framework with routing and state management
- you require mature server-side rendering — SSR support is still experimental
- you depend on the legacy Shoelace package and don't plan to migrate
- you need every component available in the Figma design kit, which lags behind

## Facets
- artifact type: library
- maturity: active
- function: ui-components, css-framework, theme, internationalization, accessibility
- domain: web-development, frontend, web-design, cross-platform
- platform: browser, cross-platform
- tags: web-components, design-system, custom-elements, lit, shoelace-successor, theming, framework-agnostic, cdn, web-server, nodejs

## Member repositories
- shoelace-style/webawesome (main) score 95
- shoelace-style/shoelace (mirror) score 10

## Provenance
- Observed fields: from GitHub, fetched 2026-09-03T02:15:17.836848+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:12:59.817304+00:00, confidence not recorded.
  - readme: https://github.com/shoelace-style/webawesome (fetched 2026-09-03T02:15:17.836848+00:00, sha 8ee75d580638)
  - homepage: https://webawesome.com (fetched 2026-08-29T08:08:01.366454+00:00, sha b41c299471b4)
  - site_page: https://webawesome.com/docs (fetched 2026-08-29T08:08:01.369382+00:00, sha 81f0c6a002c8)
  - site_page: https://webawesome.com/docs/usage (fetched 2026-08-29T08:08:01.371124+00:00, sha be878b0a0da5)
  - site_page: https://webawesome.com/docs/form-controls (fetched 2026-08-29T08:08:01.372989+00:00, sha 03b77d50a844)
  - site_page: https://webawesome.com/docs/localization (fetched 2026-08-29T08:08:01.374977+00:00, sha 0274218ad0f0)
  - site_page: https://webawesome.com/docs/frameworks (fetched 2026-08-29T08:08:01.377215+00:00, sha fdb42a92d29f)
  - site_page: https://webawesome.com/docs/ai (fetched 2026-08-29T08:08:01.379009+00:00, sha 8c926eff7dfc)
  - site_page: https://webawesome.com/docs/resources/figma (fetched 2026-08-29T08:08:01.380889+00:00, sha 06aa4948bf40)
  - site_page: https://webawesome.com/docs/ssr (fetched 2026-08-29T08:08:01.382825+00:00, sha 693fb940d515)
- Data as of 2026-08-30T08:39:29.467469+00:00.