{"slug": "pimp-my-vault", "title": "PIMP MY VAULT", "summary": "Eric Michaud at Easy Machine AI released a free prompt pack that turns one visual reference into a coordinated Obsidian theme and matching custom dashboard skin. The pack uses Impeccable, a design workflow tool, to keep product context and visual rules connected across outputs. The process includes analysis, mockup, and implementation steps for both the dashboard and the Obsidian workspace.", "body_md": "| type | guide | ||||\n|---|---|---|---|---|---|\n| status | active | ||||\n| version | 1.1 | ||||\n| updated | 2026-07-13 | ||||\n| tags |\n|\n\nA free prompt pack for turning one visual reference into a coordinated Obsidian theme and, if you have one, a matching custom dashboard skin.\n\nUse the prompts in order. Review each result before your agent writes code or installs files.\n\nCreated by [Eric Michaud](https://www.youtube.com/@theericmichaud) at Easy Machine AI.\n\nFor the full workflow shown in the video, use [Impeccable](https://impeccable.style/) inside an AI coding tool that can inspect and edit local files, such as Codex CLI, Claude Code, Cursor, Gemini CLI, or another agent with project access.\n\nYou can run the analysis and mockup prompts in a normal web chat. That chat cannot build, test, or install a working theme unless it can access your vault files.\n\nThe plain prompts still work without Impeccable, but you will need to carry the approved decisions from one step to the next yourself. Impeccable is the recommended route because it keeps the product context, design rules, build, and quality checks connected.\n\nYou are using one reference image to create a working design system, not asking an AI to copy a picture into CSS.\n\nThe process has two connected outputs:\n\n- A skin for your custom dashboard or plugin, if you have one.\n- A full Obsidian theme for the rest of the vault.\n\nImpeccable stores the product context in `PRODUCT.md`\n\nand the approved visual rules in `DESIGN.md`\n\n. Your agent then uses that same contract for the dashboard and the Obsidian workspace. This is what makes the final vault feel like one system instead of two unrelated themes.\n\n| What happens | Section | Impeccable step | Output |\n|---|---|---|---|\n| Set the product context | Before A | `/impeccable init` |\n`PRODUCT.md` and initial design context |\n| Study one inspiration image | A | Use the analysis prompt | Approved Take/Avoid list |\n| See the direction before coding | B | Use the mockup prompt | Approved visual mockup or mockup brief |\n| Turn the look into rules | C | `/impeccable shape ...` |\nShared `DESIGN.md` contract |\n| Apply it to a custom dashboard | D | `/impeccable craft ...` |\nScoped dashboard skin |\n| Apply it to all of Obsidian | E | `/impeccable craft ...` |\nInstallable Obsidian theme |\n| Check the finished system | F | `/impeccable audit ...` , then `/impeccable polish ...` |\nTested final files |\n\n| Goal | Use these sections | What you need |\n|---|---|---|\n| Study a reference and create a visual concept | A-B | An image-capable AI assistant |\n| Theme a normal Obsidian vault | A-C, E-F | Impeccable and an AI coding tool with vault access |\n| Theme a vault plus a custom dashboard or plugin UI | A-F | Impeccable and an AI coding tool with source-code access |\n| Port the finished design to another dashboard | G | The completed `DESIGN.md` and the target dashboard source |\n\nSkip the dashboard sections if your vault does not contain a custom dashboard or plugin interface.\n\nBuild and test in a copy of your vault. Obsidian recommends a separate development vault when plugin work could affect files or settings.\n\nBefore you begin:\n\n- Copy the vault or create a test vault.\n- Keep the original theme enabled until the new files pass review.\n- Check for existing\n`PRODUCT.md`\n\nand`DESIGN.md`\n\nfiles before creating new ones. - Never give an agent credentials, private keys, or unrelated folders.\n- Use another theme only to understand file coverage and structure. Do not copy proprietary CSS.\n\nThe prompts tell the agent to wait for approval before installation. Keep that gate.\n\n[Impeccable](https://impeccable.style/) gives your coding agent the design workflow used by this pack. Install it before starting Section A if you want to follow the complete video process.\n\n- Node.js 22.12 or newer\n- An AI coding harness\n- A local project or vault folder\n\nRun installation commands in a terminal from the root of the project you want to style.\n\n```\nnpx impeccable install\n```\n\nReload your coding tool after installation. You should see `/impeccable`\n\nin its command list.\n\nGitHub Copilot app users can skip the install and enable Impeccable under **Settings > Experimental**.\n\nCodex users may need to open `/hooks`\n\nand approve the project hook after installation or an update.\n\nType this inside your AI coding tool, not in the terminal:\n\n```\n/impeccable init\n```\n\nImpeccable will ask about your audience, visual references, voice, and anti-references. For this workflow, choose **product** when you are styling an app, dashboard, or working vault interface.\n\nReview the generated `PRODUCT.md`\n\n. Keep your existing file if the project already has one, or merge the useful parts instead of overwriting it.\n\nIf your vault or dashboard already has a visual system, capture it next:\n\n```\n/impeccable document\n```\n\nSkip `document`\n\nwhen you are starting from a blank project with no interface or styles to inspect. Section C will create the shared design contract for the new direction.\n\n- Install Impeccable and reload your coding tool.\n- Run\n`/impeccable init`\n\nand review`PRODUCT.md`\n\n. - Run\n`/impeccable document`\n\nif the project already has an interface worth documenting. - Complete Sections A and B. Approve the Take/Avoid list and one visual direction.\n- Use\n`/impeccable shape`\n\nin Section C to turn that direction into a shared`DESIGN.md`\n\n. - Use\n`/impeccable craft`\n\nin Sections D and E to build the dashboard skin and Obsidian theme from that same contract. - Use\n`/impeccable audit`\n\nand`/impeccable polish`\n\nin Section F before installing anything in your main vault.\n\nRun these from the project root in a terminal:\n\n```\nnpx impeccable check\nnpx impeccable update\n```\n\nClaude Code users can add the official plugin marketplace:\n\n```\n/plugin marketplace add pbakaus/impeccable\n```\n\nOpen `/plugin`\n\nand install Impeccable from the list.\n\nThe general skills installer also works:\n\n```\nnpx skills add pbakaus/impeccable\n```\n\nThat route installs a shared build instead of one tailored to your coding tool.\n\nOfficial references:\n\nReplace each placeholder before implementation.\n\n```\n[PRODUCT_NAME] = the dashboard, plugin, workspace, or vault name\n[PRODUCT_ROOT] = the folder containing the product source; use . for the current root\n[VAULT_ROOT] = the root folder of the Obsidian vault\n[CONFIG_DIR] = the Obsidian configuration folder; usually .obsidian\n[DASHBOARD_ROOT_SELECTOR] = the CSS selector that scopes the custom dashboard\n[THEME_NAME] = the human-facing theme name, such as Dust and Ink\n[THEME_SLUG] = the lowercase hyphenated name, such as dust-and-ink\n[AUTHOR_NAME] = the name shown in manifest.json\n[REFERENCE_THEME_PATH] = optional path to a complete reference theme\n```\n\n`[PRODUCT_ROOT]`\n\nand `[DASHBOARD_ROOT_SELECTOR]`\n\napply only to a custom dashboard or plugin UI.\n\nAsk your agent to find the dashboard root selector if you do not know it. Do not guess.\n\nCollect what you have:\n\n- a screenshot of the current vault or dashboard\n- one strong visual reference\n- the relevant source files\n- existing product or design documentation\n- tests or a repeatable manual test checklist\n\nOne reference with a clear point of view beats a folder full of unrelated images.\n\nRun `/impeccable init`\n\nfirst. Then paste this into the same coding-agent session:\n\n```\nUse Impeccable throughout this project. We are turning one visual reference into\na coordinated design system for an Obsidian vault, then applying that system to\nthe custom dashboard or plugin and the surrounding Obsidian workspace.\n\nBefore editing anything:\n1. Read PRODUCT.md and any existing DESIGN.md files.\n2. Inspect the project structure and identify whether this is a plain vault, a\n   vault with CSS snippets, or a vault with a custom dashboard/plugin UI.\n3. Find any existing theme files, snippets, root\n   selectors, styling APIs, and tests.\n4. Tell me which sections of this prompt pack apply.\n5. Treat each approved output as an input to the next section. Keep the\n   Take/Avoid list, mockup, and DESIGN.md aligned.\n6. Flag missing inputs instead of inventing them.\n\nDo not install files into the live Obsidian configuration folder, change plugin\nlogic, alter vault content, or perform Git actions without my approval.\n\nIf you cannot access local files, say so. Return complete file contents in\nMarkdown code blocks with the intended save paths so I can install them myself.\n```\n\nAttach the current interface and the reference image.\n\n```\nAnalyze the attached visual reference as inspiration for a dense Obsidian-based\nproduct interface.\n\nStudy the screenshot of the existing [PRODUCT_NAME] interface so your analysis\nstays grounded in the real product. Extract the reference's color roles,\ntypographic character, spacing rhythm, surface hierarchy, borders, shadows,\ntextures, control shapes, and interaction-state ideas.\n\nSeparate reusable design principles from literal imagery that would make the\nproduct harder to use. Return a concise Take/Avoid list. Explain how each Take\nitem would affect a working interface.\n\nDo not write CSS or change files yet.\n```\n\nIf you are working from one or more reference `DESIGN.md`\n\nfiles:\n\n```\nInspect the selected reference DESIGN.md files and screenshots of the existing\n[PRODUCT_NAME] interface.\n\nExtract the traits that can survive dense product UI: typography, surface\nhierarchy, density, spacing, borders, controls, active states, shadows, and\ngraphic treatments.\n\nReturn a concise Take/Avoid list. Cite the source file for each extracted rule.\nDo not build or edit the product yet.\n```\n\nApprove the Take/Avoid list before continuing.\n\nAttach the current interface and approved reference.\n\n```\nCreate a high-fidelity visual mockup of the attached [PRODUCT_NAME] interface.\n\nPreserve the existing navigation, information hierarchy, modules, labels,\ncontrols, and approximate density. Restyle the interface using the attached\nreference and this direction:\n\n[DESCRIBE THE DIRECTION IN PLAIN LANGUAGE]\n\nKeep dense product text readable. Do not invent features, remove modules, or\nturn the interface into a generic analytics dashboard. Return one visual\nconcept, not implementation code.\n```\n\nIf the assistant cannot generate images, replace the final sentence with:\n\n```\nReturn an implementation-ready mockup brief with a layout map, semantic color\nroles, typography choices, spacing values, component treatments, and a short\nvisual acceptance checklist.\n```\n\nOnce the direction works, stop generating alternatives and formalize it.\n\nRun this Impeccable command first:\n\n```\n/impeccable shape the visual system described by the approved reference analysis\n```\n\nThen give your agent this scope:\n\n```\nCreate a shared visual design contract for [PRODUCT_NAME] and its surrounding\nObsidian workspace.\n\nRead, when present:\n- PRODUCT.md\n- DESIGN.md\n- screenshots of the real interface\n- the selected reference or approved mockup\n- the approved Take/Avoid notes\n- useful reference DESIGN.md files\n\nWrite:\n[PRODUCT_ROOT]/themes/[THEME_SLUG]/DESIGN.md\n\nIf you cannot write files, return the complete Markdown document and label it\nwith that save path.\n\nDefine:\n- the creative direction and intended working environment\n- semantic color roles for light and dark modes\n- typography roles and readable information density\n- spacing and layout rhythm\n- borders, radii, shadows, textures, and material treatments\n- buttons, inputs, tabs, menus, cards, tables, lists, and statuses\n- hover, focus, active, selected, disabled, loading, warning, error, and success\n- responsive and narrow-pane behavior\n- reduced-motion behavior and WCAG AA requirements\n- anti-references and prohibited treatments\n\nCreate separate application guidance for:\n1. Custom dashboard or plugin components, if the project contains them.\n2. Obsidian app chrome and Markdown content.\n\nPreserve navigation, modules, data, actions, and behavior. Allow presentational\ngeometry and component micro-layout to change when the approved direction\nbenefits.\n\nDefine a small customization vocabulary for accent, background, surface, text,\nborder, radius, shadow, typography, and density. End with measurable acceptance\nchecks. Do not write production CSS yet.\n```\n\nReview the contract before implementation. Check the tokens, component states, Obsidian rules, dashboard rules, and anti-references.\n\nIf you cannot use Impeccable, skip the slash command and give your assistant the scope prompt directly. Save its approved output as the same `DESIGN.md`\n\nso the later steps still share one source of truth.\n\nSkip this section for a plain Obsidian vault.\n\nRun this Impeccable command first:\n\n```\n/impeccable craft the dashboard skin from [PRODUCT_ROOT]/themes/[THEME_SLUG]/DESIGN.md\n```\n\nThen apply this scope:\n\n```\nBuild the [PRODUCT_NAME] dashboard styling layer from the approved DESIGN.md.\n\nRead:\n- PRODUCT.md, if present\n- [PRODUCT_ROOT]/themes/[THEME_SLUG]/DESIGN.md\n- the dashboard's base stylesheet\n- the app shell or layout source\n- an existing dashboard skin, if available\n- relevant styling tests\n\nCreate:\n[PRODUCT_ROOT]/themes/[THEME_SLUG]/[THEME_SLUG].css\n\nInspect the existing theme API first. Replace literal radius, spacing, gap,\ncolor, and shadow values with stable theme tokens only where the base CSS blocks\nthe approved design.\n\nScope every dashboard rule to [DASHBOARD_ROOT_SELECTOR] or one of its\ndescendants. Do not change plugin logic, vault writes, navigation, data, content\narchitecture, or actions. Do not use global Obsidian selectors in the dashboard\nstylesheet.\n\nImplement readable light and dark modes with clear hover, focus, active,\nselected, disabled, loading, warning, error, and success states. Respect reduced\nmotion and keep controls dimensionally stable when their state changes.\n\nExpose a small customization block for accent, background, surface, text,\nborder, radius, shadow, typography, and density.\n\nAdd or update checks for token consumption, selector scope, prohibited global\nselectors, and theme structure. Test each major view, narrow panes, keyboard\nfocus, hidden and visible help states, and both color modes.\n\nDo not install the stylesheet into [CONFIG_DIR] until the checks pass and I\napprove the preview. Do not perform Git actions.\n```\n\nAfter approval, copy the verified stylesheet to:\n\n```\n[VAULT_ROOT]/[CONFIG_DIR]/snippets/[THEME_SLUG].css\n```\n\nIn Obsidian, open **Settings > Appearance > CSS snippets**, reload the snippets, and enable it.\n\nIf you cannot use Impeccable, skip the slash command and give your coding assistant the scope prompt directly.\n\nRun this Impeccable command first:\n\n```\n/impeccable craft the matching Obsidian theme from [PRODUCT_ROOT]/themes/[THEME_SLUG]/DESIGN.md\n```\n\nThen apply this scope:\n\n```\nBuild a complete Obsidian theme from the approved [THEME_NAME] DESIGN.md.\n\nRead:\n- PRODUCT.md, if present\n- [PRODUCT_ROOT]/themes/[THEME_SLUG]/DESIGN.md\n- [PRODUCT_ROOT]/themes/[THEME_SLUG]/[THEME_SLUG].css, if a dashboard skin exists\n- [REFERENCE_THEME_PATH], if provided\n\nUse the reference theme only to understand the breadth and structure of a\ncomplete Obsidian theme. Do not copy its visual direction or proprietary code.\n\nCreate:\n- [PRODUCT_ROOT]/themes/[THEME_SLUG]/obsidian-theme/[THEME_NAME]/manifest.json\n- [PRODUCT_ROOT]/themes/[THEME_SLUG]/obsidian-theme/[THEME_NAME]/theme.css\n\nUse the stable folder and theme name [THEME_NAME]. Include valid manifest fields:\nname, version, minAppVersion, and author. Use semantic versioning such as 1.0.0.\nSet author to [AUTHOR_NAME]. If this may become a community theme, use a short\nBasic Latin name and do not include the words Obsidian or Theme.\n\nCarry the design contract's semantic token intent into the Obsidian theme.\nOverride official Obsidian CSS variables first. Add narrow selectors only where\nvariables cannot express the approved design.\n\nCover the app background, workspace, title bar, tabs, splits, ribbon, sidebars,\nstatus bar, file explorer, search, command palette, menus, popovers, tooltips,\nmodals, Settings, buttons, inputs, selects, toggles, sliders, checkboxes,\nMarkdown editing and reading views, headings, links, lists, blockquotes, tables,\ncode, embeds, callouts, tags, selection, drag targets, scrollbars, and major\ninteraction states.\n\nKeep notes and dense Settings screens readable. Support light and dark modes and\nnarrow windows. Decorative texture must preserve contrast and cannot carry\nstatus information by itself.\n\nDo not place selectors owned by [DASHBOARD_ROOT_SELECTOR] in the Obsidian theme.\nSkip that rule when the project has no custom dashboard. Do not require Style\nSettings or another plugin for the theme to work.\n\nExpose a small customization block for accent, background, surface, text,\nborder, radius, shadow, typography, and density. Use the same semantic names as\nthe dashboard skin where practical, or document the mapping.\n\nAdd checks for manifest validity, required files, color-mode coverage,\nprohibited dashboard selectors, private paths, remote assets, and absolute\nmachine paths. Inspect reading view, editing view, Settings, menus, explorer,\ntabs, and the embedded dashboard when present.\n\nDo not install the theme into [CONFIG_DIR] until the checks pass and I approve\nthe preview. Do not perform Git actions.\n```\n\nAfter approval, copy the folder to:\n\n```\n[VAULT_ROOT]/[CONFIG_DIR]/themes/[THEME_NAME]/\n  manifest.json\n  theme.css\n```\n\nSelect the theme under **Settings > Appearance > Themes**. Reload Obsidian if the theme does not appear.\n\nIf you cannot use Impeccable, skip the slash command and give your coding assistant the scope prompt directly.\n\nOfficial Obsidian references:\n\nRun these Impeccable commands in order:\n\n```\n/impeccable audit the [THEME_NAME] dashboard skin and Obsidian theme\n/impeccable polish the [THEME_NAME] dashboard skin and Obsidian theme\n```\n\nIf you cannot use Impeccable:\n\n```\nAudit the completed dashboard skin and Obsidian theme against the approved\nDESIGN.md.\n\nCheck contrast, keyboard focus, text overflow, narrow panes, light and dark\nmodes, reduced motion, selector ownership, Markdown readability, Settings,\nmenus, tabs, explorer, and unchanged product behavior.\n\nList failures with file paths and selectors. Fix only confirmed failures. Run\nthe relevant tests again and report the results.\n```\n\nTest the final files in the development vault before copying them to your main vault.\n\nUse this section when another version exposes a different root selector or theme API. Port the design contract instead of copying selectors.\n\n```\nRead:\n- [PRODUCT_ROOT]/themes/[THEME_SLUG]/DESIGN.md\n- the target dashboard's base stylesheet\n- the target dashboard's customization documentation\n- an existing target-version skin, if available\n\nCreate a separate dashboard skin that applies the approved design contract\nthrough the target version's public theme API.\n\nPreserve navigation, modules, actions, data, and plugin logic. Do not copy\nselectors from another dashboard version. Scope every component override to the\ntarget dashboard's root selector and add no global Obsidian selectors.\n\nTest each major view, narrow panes, keyboard focus, and light and dark modes. Do\nnot replace a live plugin or perform Git actions without approval.\n```\n\nRun `npx impeccable install`\n\nfrom the project root, then reload your coding tool. Check that the installer wrote files into the tool's expected skill folder.\n\nAttach the image in chat or save it inside the project and provide the exact path. Ask the agent to confirm that it opened the image before analysis.\n\nAsk the agent to inspect the rendered dashboard root and base stylesheet. Keep dashboard rules out of the global Obsidian theme until the selector is confirmed.\n\nDisable it under **Settings > Appearance > CSS snippets**. The stylesheet contains unscoped selectors. Ask the agent to scope every rule to `[DASHBOARD_ROOT_SELECTOR]`\n\n.\n\nThat can be correct. The Obsidian theme owns app chrome and Markdown. The separate dashboard stylesheet owns custom dashboard components.\n\nTest narrow panes during development. Remove unsupported effects, oversized fixed widths, remote assets, and hover-only controls. Keep a readable fallback for each decorative treatment.\n\nConfirm that the assistant has local filesystem access. A web chat can write file contents for you, but you must save, test, and install them yourself.\n\nConfirm each item before sharing the generated theme:\n\n- no private names, machine paths, credentials, or internal URLs remain\n- every placeholder has been replaced\n`manifest.json`\n\nuses valid JSON and semantic versioning- dashboard and Obsidian selectors stay in their respective stylesheets\n- light and dark modes remain readable\n- keyboard focus and reduced-motion behavior work\n- source images and fonts are local or licensed for redistribution\n- product navigation, data, actions, and note content remain unchanged\n- tests and the manual inspection checklist pass\n- installation instructions name the correct files and folders\n\nThis prompt pack is free to use and adapt. Impeccable and Obsidian are separate projects maintained by their respective creators. Link to their official documentation when you redistribute this file so readers receive current installation instructions.", "url": "https://wpnews.pro/news/pimp-my-vault", "canonical_source": "https://gist.github.com/ERICJ3ffrey/a27238066752ecd0474e1b5babf8ea6f", "published_at": "2026-07-13 19:47:14+00:00", "updated_at": "2026-07-14 23:52:39.989615+00:00", "lang": "en", "topics": ["developer-tools", "ai-tools"], "entities": ["Eric Michaud", "Easy Machine AI", "Obsidian", "Impeccable", "Codex CLI", "Claude Code", "Cursor", "Gemini CLI"], "alternates": {"html": "https://wpnews.pro/news/pimp-my-vault", "markdown": "https://wpnews.pro/news/pimp-my-vault.md", "text": "https://wpnews.pro/news/pimp-my-vault.txt", "jsonld": "https://wpnews.pro/news/pimp-my-vault.jsonld"}}