Installation
CDN
Use Auralix UI directly in the browser without a build step.
Create project
Start by adding the following code to the <head> of your HTML file:
html
<!-- Styles -->
<link rel="stylesheet" href="https://unpkg.com/auralix-ui/dist/styles.css">
<!-- Dependencies -->
<script src="https://unpkg.com/react@19/umd/react.production.min.js"></script>
<script src="https://unpkg.com/react-dom@19/umd/react-dom.production.min.js"></script>Add Components
Add the Auralix UI script to load the components:
html
<!-- Auralix UI -->
<script src="https://unpkg.com/auralix-ui/dist/index.global.js"></script>Usage
Access components via the window.AuralixUI global object.
index.html
html
<div id="root"></div>
<script>
const { Button, Badge } = window.AuralixUI;
const { createRoot } = ReactDOM;
function App() {
return (
<div className="p-4">
<Badge variant="success">CDN Mode</Badge>
<Button onClick={() => alert('Hello!')} className="ml-2">
Click Me
</Button>
</div>
);
}
const root = createRoot(document.getElementById('root'));
root.render(<App />);
</script>