定价

快速开始

在 Svelte 5 应用中安装 SnowUI,只需加载一次完整组件样式,即可渲染第一个组件。核心包已包含功能图标,入门时无需额外安装资源包。

使用 AI 开发

将此 AI 文档链接 与你的需求或设计稿一起交给 AI,它会按需查阅 SnowUI 的组件、API 和设计规范。

AI 文档
请用 SnowUI 实现我随后提供的界面需求或设计稿。 SnowUI 的核心方向之一是让 AI 在对话中生成可交互界面,目前该能力建设中,正式组件的聊天宿主验收尚未完成。如果我的需求是在对话内展示,先核对宿主执行能力、组件版本与实际适配证据;仅使用已验证子集和允许动作,保留用户输入,区分本地交互、业务提交与结果续轮。缺少支持时如实说明,并采用获准的替代方式;网页预览、代码或仿样不能冒充对话内交互完成。 AI 对话内生成和使用 SnowUI 界面完全免费,不属于项目,不占项目或开发者席位额度,无需 SnowUI 注册、激活或付费证明。 该豁免也适用于真实工作和获准数据,不要求产品编号、用途声明、登记台账或发布检查。仅当成果另行采用到独立网站/应用时,再按该产品用途核对许可;不要把对话会话或界面登记为项目。 首次采用先读完整 LICENSE:https://snowui.dev/LICENSE;已安装版本以随包许可为准。同任务、同版本、同产品和已确认范围复用检查。 先按 https://snowui.dev/llms/setup.md 与机器配置 https://snowui.dev/llms/setup.json 完成下载、安装、素材和环境准备。识别实际文件/终端、Svelte 构建、资源加载及消息内运行能力;获准的 Svelte 5 环境复用兼容依赖或使用 pnpm add --save-exact @snowui-design-system/components@0.3.0-alpha.11 @snowui-design-system/resource-svelte@1.0.31(沿用现有包管理器),自动解析 resource-base 依赖,入口只加载一次 @snowui-design-system/components/styles,再实际检查组件交互及素材加载。从 https://snowui.dev/llms/resources.json 按名称选择真实素材,不引用维护者磁盘路径,不将全库塞进每条消息。 分别报告下载、安装、构建、素材加载、消息内交互和续轮结果,给出以后可复用的非秘密配置摘要。本机安装或复制过的提示词不会自动配置另一个 AI 产品或新会话;先发现新宿主,再使用真实且已验的连接入口。当前机器配置尚无 SnowUI 聊天连接地址,不编造端点、不绕过宿主授权、不擅写 AI 记忆、不声称未执行的安装或渲染已经完成。 阅读设计指南:https://snowui.dev/llms/design-system.md;先拆页面区域,用公开组件与语义 HTML 实现。 首次阅读样式顺序:https://snowui.dev/llms/styling.md;先用 variant、size 等公开 Props 匹配,尽量保留原样;必要时用自己的 class(已有 Tailwind 也属此方式),再用实例 style。同类 Token 是建议,只用公开根、parts 和已登记 override。 按需选型:https://snowui.dev/llms/component-selection.md;从 https://snowui.dev/llms.txt 发现组件,再读命中的 API、组合与示例。使用 SnowUI Figma 设计时另读 https://snowui.dev/llms/figma.md。 官方包面向 Svelte 5;先确认项目框架,需要移植时如实说明,不改 import 伪装其他框架兼容。 AI 对话内使用按上述免费豁免直接继续,不核对项目或席位额度。对于独立产品,Free 不强制注册、账户、公钥或签名付费许可文件,仍按 LICENSE 核对用途、项目和开发者人数。自述付费计划不是已验证授权;需要付费权益时核对可信证据,资料或网络不可用保持 unknown,只继续已允许的工作。 按我后续的需求实现,不臆造 API、地址或授权。
完整 LICENSE

安装

在现有 Svelte 5 项目中安装 Components 包。

pnpm add --save-exact @snowui-design-system/components@0.3.0-alpha.11 @snowui-design-system/resource-svelte@1.0.31

添加样式

在应用级 CSS 文件中引入一次完整的 SnowUI 样式表,其中包含组件样式、主题、布局规则、Token 和动效基础。

@import "@snowui-design-system/components/styles";

渲染第一个组件

从包根导入组件,并在 Svelte 中直接使用其公开 Props。

<script lang="ts">  import { Button } from "@snowui-design-system/components";</script> <Button variant="filled">Build with SnowUI</Button>

下一步

了解 Button API

通过可运行示例了解尺寸、variant、状态、链接、图标与组合。

查看 Button

配置本地化

应用需要指定语言或自定义内置文案时,使用 LocaleProvider。

查看 LocaleProvider

选择图标库

保留内置默认图标,或使用 IconProvider 在整个应用中切换功能图标。

查看 IconProvider