# <img src="doc/public/logo.svg" width="320" style="max-width: 100%;" alt="sashimi UI">

## Unleash the native power of HTML

sashimi UI is a minimal CSS framework designed to enhance, not replace, the **native capabilities of HTML**.
It styles native HTML elements without unnecessary wrapping or abstraction.
By embracing the **natural behavior of the web**, sashimi UI lets the platform shine in its purest form.

![sashimi UI showcase](doc/public/samples.png)

## Documentation

Visit [https://yuto-hasegawa.github.io/sashimi-ui/](https://yuto-hasegawa.github.io/sashimi-ui/) for full documentation.

## Migrating from 1.x

See the [2.x migration guide](CHANGELOG.md#migrating-from-1x) for breaking
changes and upgrade instructions.

## Usage

### Use the CSS files

Load the default theme and styles directly from a CDN, or download the CSS files
and add them to your project.

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sashimi-ui@2.1.0/dist/css/default.theme.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sashimi-ui@2.1.0/dist/css/bundle.css">

<button class="button">Your first button</button>
```

### Install via npm

Install sashimi UI:

```sh
npm install sashimi-ui
```

Import the default theme and styles:

```jsx
import "sashimi-ui/default.theme.css";
import "sashimi-ui/bundle.css";

// inside your components
<button class="button">Your first button</button>
```

## License

Licensed under the [MIT license](LICENSE).