If you can build a webpage, you can build a skin
No new framework to learn. HTML + CSS + JS plus one skin.json — that's a skin running on a Windows desktop.
my-skin/├─ skin.json # manifest├─ index.html # your webpage└─ assets/ # anything else
You bring the idea. AI writes the skin.
In the age of vibe coding, everyone is a creator. No coding required up front — describe the idea clearly, and AI writes a skin that runs on your desktop.
Step 1 · Send the dev guide first
Introduce Driftlet to the AI first
Get the AI up to speed on Driftlet's skin format first — send the Skin Development Guide from the repo as context: skin.json fields, permission declarations and sizing rules are all in there. Then share your idea, and the skin comes out right the first time.
Step 2 · Copy a prompt and keep chatting
Make a round clock skin: a deep-ocean gradient dial with white hands and a thin second hand, monospaced numerals and bolder hour markers — frosted-glass feel at 80% opacity.
Make a weather-card skin: a rounded frosted-glass card in ocean tones — big temperature on the left, weather icon and city on the right, a small footer line with humidity and wind; the city should be customizable.
Make a desktop to-do skin: a minimal white card with round checkboxes — checked items gray out with a strikethrough and sink to the bottom; an input on top adds tasks on Enter; data persists locally across restarts.
From one sentence to a desktop skin
Describe it
With the doc as context, tell the AI the look, colors and features you want — any prompt above works as-is.
Save the folder
Put the AI's skin.json and index.html into one folder — or let the AI edit the files directly.
Save & see
Dev mode hot-reloads on every save — send screenshots and feedback back to the AI and iterate.
Pack & share
pack-skin.exe outputs a .dskin in one click — friends install it with a double-click.
The whole anatomy of a skin
skin.json
Declares name, version, entry point, permissions and settings — what the skin is and what it needs, in one file.
index.html
A normal webpage — use any framework or vanilla JS. The desktop is its browser.
window.__DESK_PP__ _
A bridge object injected by Driftlet, letting skins safely call the system powers they've been granted.
One skin.json says it all
{"name": "海上时钟","version": "1.0.0","author": "you","entry": "index.html","window": { "width": 320, "height": 180, "transparent": true }}
What this tab says
Name, entry, window size — the skin's skeleton.
Declare only what you truly need — users review each one at install time.
Choose from 19 control types; Driftlet auto-generates the panel and pushes values live.
One bridge between webpage and system
Call window.__DESK_PP__ inside your skin to use granted system powers — clipboard, file sandbox, shell… Every call is governed by the permission model.
// Read the clipboardconst text = await window.__DESK_PP__.clipboard.readText();// Write to the sandboxawait window.__DESK_PP__.file.write("cache.json", data);
From folder to shared skin in four steps
Create a folder
skin.json + index.html. That is all it takes.
Save to hot-reload
Skins auto-reload on save (300ms debounce) — true WYSIWYG.
Package with pack-skin.exe
A standalone, no-install tool that outputs a .dskin in one click.
Share it
Anyone with the .dskin installs it by double-clicking — and future updates keep their settings.
Your first skin is ten minutes away
Clone the repo and follow the README.