A modern, lightweight UI framework built with Web Components.
Note: This is an early technology preview. APIs and structures may change.
npm install @semantic-ui/coreFor the most efficient imports, you can import individual components directly:
// Import specific components
import { UIButton } from '@semantic-ui/core/button';
import { UICard } from '@semantic-ui/core/card';
// Import global theme
import '@semantic-ui/core/theme';
// Or import component-specific themes (if needed)
import '@semantic-ui/core/theme/button';
import '@semantic-ui/core/theme/card';If you need multiple components, you can import from the main package:
// Import multiple components
import { UIButton, UICard, UIMenu } from '@semantic-ui/core';
// Import global theme
import '@semantic-ui/core/theme';For quick prototyping or projects without a build step, you can use the CDN:
<!-- Import the entire framework -->
<script type="module" src="https://cdn.jsdelivr.net/npm/@semantic-ui/core/dist/cdn/semantic-ui.min.js"></script>
<!-- Import global theme CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@semantic-ui/core/dist/cdn/theme.min.css">Or load individual components:
<!-- Import just the button component -->
<script type="module" src="https://cdn.jsdelivr.net/npm/@semantic-ui/core/dist/cdn/button.min.js"></script>
<!-- Import global theme CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@semantic-ui/core/dist/cdn/theme.min.css">
<!-- Or import component-specific theme (if needed) -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@semantic-ui/core/dist/cdn/theme/button.min.css">Please see CONTRIBUTING.md for development setup instructions and contribution guidelines.
MIT