Semantic UI
ctrl+k
Enter a search term above to see results...
On This Page
Authoring Guide
Authoring Guide
Semantic UI provides packages for authoring standard W3C Web Components using the same underlying technologies built to create the first-party UI component framework.
Web components can be used anywhere you write html, work natively in modern browsers and have first-class support with frameworks like React, Vue, and Angular which means you can create your UI once and use it anywhere you ship websites.
Key Features
- Signals-based reactivity for state management.
- Declarative templating for rendering component views.
- DOM querying tailored for Shadow DOM encapsulation.
- CSS token framework for dark/light mode styling and theming.
- Integrated event handling tools.
- Declarative keybinding management.
To see examples of custom components check out our examples gallery.
Packages
Semantic UI provides a set of composable libraries for creating web components:
@semantic-ui/component
Core library for defining and managing Web Component lifecycle, state, and behavior.
@semantic-ui/templating
Template language with AST compilation for rendering component views.
@semantic-ui/reactivity
Signals-based reactivity library for managing component state.
@semantic-ui/query
Chainable DOM querying API adapted for Shadow DOM encapsulation.
@semantic-ui/utils
General-purpose JavaScript functions focused on readability.
Each core library like
@semantic-ui/query,@semantic-ui/reactivity,@semantic-ui/templatingand@semantic-ui/utilsare designed to be used as standalone packages that can be used without adoping the entire design framework.