快速开始

1inUI 是一个 Discord 风格的轻量级组件库，零依赖，开箱即用。

特性

开箱即用 - CDN 引入即可使用，无需构建工具
Discord 风格 - 大圆角、柔和配色、流畅动画
暗色模式 - 内置暗色模式，一键切换
零依赖 - 纯原生 CSS + JS
60+ 图标 - 线性风格 SVG 图标
轻量 - CSS 37KB + JS 12KB

CDN 引入

在 HTML 文件的 <head> 中添加：

<!-- CSS -->
<link rel="stylesheet" href="https://unpkg.com/1inui/dist/1in-ui.min.css">

<!-- JavaScript -->
<script src="https://unpkg.com/1inui/dist/1in-ui.min.js"></script>

<!-- 图标库 (可选) -->
<script src="https://unpkg.com/1inui/dist/1in-icons.min.js"></script>

npm 安装

npm install 1inui

第一个按钮

<button class="ui-btn ui-btn-primary">Hello 1inUI!</button>

暗色模式

// 切换主题
UI.theme.toggle()

// 设置主题
UI.theme.set('dark')  // 暗色
UI.theme.set('light') // 亮色