会写网页,就会做皮肤
不需要学新框架。HTML + CSS + JS,加一个 skin.json,就是一款能跑在 Windows 桌面上的皮肤。
my-skin/├─ skin.json # 皮肤清单├─ index.html # 你的网页└─ assets/ # 随便放
你出想法,AI 写皮肤
Vibe coding 时代,人人都是创作者。不用先学会写代码——把想法说清楚,AI 就能替你写出一款能跑在桌面上的皮肤。
第一步 · 先发开发文档
让 AI 先认识 Driftlet
先让 AI 了解 Driftlet 的皮肤格式——把仓库里的《皮肤开发指南》发过去当上下文:skin.json 字段、权限声明、自适应要求都在里面。之后再聊想法,生成的皮肤一次到位。
第二步 · 复制一条提示词,接着聊
做一个圆形时钟皮肤:深海蓝渐变表盘、白色指针,带一根细秒针;数字用等宽字体,整点刻度加粗;整体 80% 不透明度,带毛玻璃质感。
做一个天气卡片皮肤:圆角毛玻璃卡片,海洋配色;左边大号温度,右边天气图标和城市名,底部一行小字显示湿度和风速;城市名可以自定义。
做一个桌面待办皮肤:极简纯白卡片,任务前是圆形勾选框,勾选后文字变灰加删除线并自动沉到底部;顶部输入框回车添加任务;数据存本地,重开不丢。
从一句话到桌面皮肤
描述想法
文档打底之后,把想要的样子、颜色、功能讲给 AI 听,上面任何一条提示词都能直接用。
存成皮肤文件夹
把 AI 给的 skin.json 和 index.html 放进一个文件夹——或让 AI 直接帮你改文件。
边存边看
开发模式下保存即重载,哪里不满意就把截图和想法丢回给 AI 继续调。
打包分享
pack-skin.exe 一键产出 .dskin,发给朋友双击即装。
一款皮肤的全部
skin.json
声明名称、版本、入口、权限与设置项——一份文件说清皮肤是什么、需要什么。
index.html
普通的网页,随意用你爱的框架或原生 JS。桌面就是它的浏览器。
window.__DESK_PP__ _
Driftlet 注入的桥对象,皮肤通过它安全地调用已授权的系统能力。
一个 skin.json,讲清所有事
{"name": "海上时钟","version": "1.0.0","author": "you","entry": "index.html","window": { "width": 320, "height": 180, "transparent": true }}
这一页讲了什么
名称、入口、窗口尺寸——皮肤的骨架。
只声明你真正需要的权限,用户安装时会逐条看到。
19 种控件类型可选,Driftlet 自动生成配置面板并实时推送值。
一座桥,连通网页与系统
皮肤里调用 window.__DESK_PP__,即可使用已获授权的系统能力——剪贴板、文件沙箱、Shell……所有调用都受权限模型约束。
// 读取剪贴板const text = await window.__DESK_PP__.clipboard.readText();// 写入沙箱文件await window.__DESK_PP__.file.write("cache.json", data);
从文件夹到分享,只要四步
建文件夹
skin.json + index.html,就够了。
保存即重载
文件保存后皮肤自动重载(300ms 防抖),所见即所得。
pack-skin.exe 打包
免安装的独立小工具,一键产出 .dskin。
分享出去
拿到 .dskin 的人双击即装,后续更新也不会丢他们的设置。