Saltar al contenido principal

Style Shelf

Pick a style, fill a cart with UI elements, and hand the kit to your coding agent.

Style Shelf shows buttons, cards, fields, menus, tables, animations, backgrounds and icon packs, each drawn in the style you chose. Choose another style and the whole catalogue redraws in it. The kit you take away tells your coding agent (Claude Code, Cursor…) how to apply it to your project.

The cartridge id is @mnemosyne-plugins/style-shelf, under the MIT licence. It also runs in a plain browser. Its manifest places it in the sidebar and as a desktop icon.

Main gestures​

  1. Choose a style. The star adds it to Favourites.
  2. Filter by Kinds: Buttons, Cards, Fields, Motion, Backgrounds, Icons, Engines and more. An animation plays when you hover its tile.
  3. Add elements to the Cart.
  4. Whole-page preview draws a page with your selection.
  5. In the cart, Save as a theme keeps the selection under My themes.
  6. Take the kit away:
    • Write into the project (inside Mnemosyne OS) creates a style-shelf/ folder in the project you pick.
    • Download the kit saves kit.json in your downloads folder.
    • Copy the brief shows the brief, then copies it to paste into your coding agent.

After writing, Copy the instruction copies one line for your agent: Read style-shelf/BRIEF.md and apply this kit to the project.

The kit​

FileWhat it holds
kit.jsonThe style and the elements, with their code and licences
tokens.cssThe colours, radii, shadows and fonts of the style
elements.cssThe CSS of each element in the cart
BRIEF.mdThe instruction for your coding agent

Nothing else in the project is read, changed or deleted. Writing again replaces these four files. The first time, Mnemosyne OS asks for the files permission. Refusing it writes nothing.

Your own style​

Adapt on a style opens the Atelier. Change its colour groups (Accent, Grounds, Text, Status), its Shapes, its Depth and its Motion. The atelier shows the contrast ratio of each text pair. Keep saves it as your own style, marked Mine.

Propose opens GitHub with your style written in the right file, to add it to the catalogue by pull request. Contributions lists the pull requests already merged.

Where your data goes​

  • Your personal styles, themes and favourites live in the window's storage. Inside Mnemosyne OS, Mnemosyne OS keeps a copy and restores it.
  • The kit goes where you choose: your project folder, your downloads folder or the clipboard.

For agents​

One action, cart (read), returns the cart as a kit: the chosen style as design tokens, the elements with their CSS and markup, the icon packs, the licences and the brief. A coding agent connected to Mnemosyne OS reads the same kit the person built on screen.