SatriUI

「SatriUI」基于TailWind的极速开发UI框架

「SatriUI」基于TailWind的极速开发UI框架：包含600+个UI组件，面向极限编程，现已全面融入夏创公司全产品线。

介绍

SatriUI 是一个开源的 UI 组件库，基于 Tailwind CSS 框架，具有深色模式支持、Figma 设计系统、模板等功能。

它包括网站所需的所有常用组件，例如按钮、下拉菜单、导航栏、模态框，但也包括一些更高级的交互式元素，例如日期选择器。

所有元素都是使用 Tailwind CSS 和 vanilla JavaScript 的实用程序类构建的，并支持 TypeScript。

使用 SatriUI

与其他框架相比，Tailwind CSS 的缺点之一是它没有一组基本的组件。这使得快速构建用户界面原型变得非常困难。

这就是 SatriUI 发挥作用的地方：它基于 Tailwind CSS，同时允许您使用 Bootstrap 或 Bulma 等经典 CSS 框架的所有组件。

有超过 56 种类型的 UI 组件，包括按钮、警报、痕迹导航、分页和导航栏。SatriUI 还包括一些支持交互式组件的自定义 JavaScript，例如下拉列表、模态框、工具提示等。

您可以通过CDN引入SatriUI：

在head中引入CSS样式表

<link href="https://cdn.satri.cn/satriui/css/satriui.min.css"  rel="stylesheet" />

在body结束之前引入JS脚本

<script src="https://cdn.satri.cn/satriui/js/satriui.min.js"></script>

模板

您可以在夏创公司旗下「鲁班锤平台」中浏览与下载最新的、基于SatriUI的模板。

适用

本UI框架基于 Tailwind CSS ，借鉴现代化前端方案，适合以后端开发为主的程序员快速创建前端视图。

截止2024年9月20日，我司已在4个客户项目与2个自研项目中采用本UI组件库。

如果您是独立开发工程师，选择 SatriUI ，能每天节省3小时。时间苦短，多陪陪老婆孩子；

如果您是高校学生，选择 SatriUI ，在全栈学习上可以领先同龄人一大截。咱们都是专精后端的战士，精致的前端交给别人去做，咱们就图个快；

如果您是产品经理，选择 SatriUI ，手下会感谢您！

注意

本UI框架基于 Tailwind CSS，但在实际使用中，您只需要引用 SatriUI 的 CSS 和 JS 即可，无需引用 Tailwind CSS 和 JS 。

SatriUI 完全兼容 Tailwind CSS，您可以穿插使用。

SatriUI 的语法继承了 Tailwind CSS 实用主义优先的设计理念，您可以快速上手。同时，可以在仅引用 SatriUI 情况下使用 Tailwind CSS 。

与其把 SatriUI 当作开箱即用的集成式组件库，不如当成一个对 Tailwind CSS 常用Web组件的高度封装。因此，最好是在 div 内使用 SatriUI ，而在这个 div 内使用 Tainwind CSS 进行调节。