stdf/README_en.md

[](https://github.com/dufu1991/stdf/actions/workflows/auto-public-npm.yml) [](https://github.com/dufu1991/stdf/actions/workflows/auto-releases.yml) [](https://github.com/dufu1991/stdf/actions/workflows/auto-deploy-demo.yml) [](https://github.com/dufu1991/stdf/actions/workflows/auto-sync-demo.yml)

---

S T D F

中文 • Website

---

[](https://www.npmjs.com/package/stdf) [](https://www.npmjs.com/package/stdf) [](https://www.npmjs.com/package/stdf) [](https://www.npmjs.com/package/stdf) [](https://github.com/dufu1991/stdf) [](https://github.com/dufu1991/stdf/blob/main/LICENSE)

Introduction

Mobile web component library based on Svelte and Tailwind .

Simple • Thin • Design • Fast

Features

• 🚀 No runtime, no virtual DOM, runs faster online;
• 🧰 Rich API, easily configure component styles that meet your needs;
• ✍ Based on Svelte and Tailwind, coding is quick and easy;
• 🍭 Supports dark mode;
• 📖 Provides extensive Chinese and English documentation and component examples;
• 🌍 Supports internationalization, with 60+ built-in language packages;
• 🫰 User-friendly interaction, animation parameters can be configured, and custom themes are supported;
• 🤝 Supports Tailwind libraries such as Windi CSS and UnoCSS;
• 🫡 No three -party dependence, no need to worry about the three -party library version and security issues.

Getting Started

Installation

If you have a project configured with Svelte and Tailwind, install directly.

npm i stdf -D
# or
pnpm i stdf -D

Usage

<!-- Button Demo -->
<script>
import { Button } from 'stdf';
</script>

<Button>Default</Button>

😓 No project? Create a project with Vite and reference the Vite documentation and the Tailwind CSS documentation for CSS configuration.

Preview

Please scan the QR code to access the mobile demo:

License

This project is licensed under the MIT License. Feel free to enjoy and contribute to this open-source project.

Contributors

Stargazers over time