https://github.com/basf/svelte-spectre

UI-kit based on *spectre.css* and powered by *svelte*
https://github.com/basf/svelte-spectre

spectre spectre-css spectre-css-framework svelte

Last synced: 7 days ago
JSON representation

UI-kit based on *spectre.css* and powered by *svelte*

• Host: GitHub
• URL: https://github.com/basf/svelte-spectre
• Owner: basf
• License: bsd-3-clause
• Created: 2021-11-24T00:04:48.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2026-01-16T21:15:16.000Z (3 months ago)
• Last Synced: 2026-03-28T07:42:35.910Z (14 days ago)
• Topics: spectre, spectre-css, spectre-css-framework, svelte
• Language: Svelte
• Homepage:
• Size: 7.15 MB
• Stars: 21
• Watchers: 1
• Forks: 5
• Open Issues: 9
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Svelte-spectre

[![NPM version](https://img.shields.io/npm/v/svelte-spectre.svg?style=flat)](https://www.npmjs.com/package/svelte-spectre)

[![NPM downloads](https://img.shields.io/npm/dm/svelte-spectre.svg?style=flat)](https://www.npmjs.com/package/svelte-spectre)

[![GitHub issues](https://img.shields.io/github/issues/basf/svelte-spectre?style=flat)](https://github.com/basf/svelte-spectre/issues)

UI-kit based on [spectre-css](https://spectre-org.github.io/spectre-docs/) and powered by SvelteJS. See the [documentation](https://kit.optimade.science), which is also a component explorer (storybook).

### Requirements

-   `node -v >= 15`

-   `npm -v >= 7`

## Installation

```bash

npm install

```

## Building package

This builds the GUI components in a `package` folder:

```bash

npm run package

```

## Developing

This serves a [demonstration website](https://kit.optimade.science):

```bash

npm run dev

# or start the server and open the app in a new browser tab

npm run dev -- --open

```

The demo website lives in a separate repo https://github.com/tilde-lab/svelte-spectre-storybook.

## Integration

Before creating a production version of your app, install an [adapter](https://kit.svelte.dev/docs#adapters) for your target environment. Then run:

```bash

npm run build

```

You can preview the built app with `npm run preview`, regardless of whether you installed an adapter. This should _not_ be used to serve your app in production.

## License

Copyright 2024-2026 Materials Platform for Data Science OÜ

Copyright 2021-2023 BASF SE

BSD 3-Clause