Profile My skills Saved Collections Edit profile Submit a skill

← all publishers

pablopunk

@pablopunk source repo

23 published skills

  1. ▌
    Design System · pablopunk
    The single source of truth for Fractal's UI — design principles, theme tokens, the material/glass system, component primitives, motion, and the opinions behind them. Use whenever you touch anything visual in this app; adding or restyling a component, building a modal/dialog/popover/menu, working in src/styles/global.css, adjusting colors/spacing/radii/typography, wiring a new theme, tuning the glass (opacity + blur) mode, fixing visual seams or washed-out surfaces, or deciding how a surface should look in light/dark/glass. Triggers include design system, design tokens, theme, dark mode, light mode, glass, glassmorphism, liquid glass, backdrop blur, translucent, modal, dialog, popover, command menu, card, button, input, surface, material, accent color, spacing, radius, hover/active/focus states, terminal theme, and "make this look better / more polished / more consistent".
    0
    installs
  2. ▌
    Screenshots · pablopunk bundle
    Capture and regenerate SwiftShift marketing screenshots for README/website assets. Use when updating light/dark SwiftShift screenshots, especially `www/src/images/screenshot-light.jpg` and `www/src/images/screenshot-dark.jpg`.
    0
    installs
  3. ▌
    Axiom Liquid Glass · pablopunk
    Use when implementing Liquid Glass effects, reviewing UI for Liquid Glass adoption, debugging visual artifacts, optimizing performance, or requesting expert review of Liquid Glass implementation - provides comprehensive design principles, API patterns, and troubleshooting guidance from WWDC 2025. Includes design review pressure handling and professional push-back frameworks
    0
    installs
  4. ▌
    Debugger · pablopunk
    Debug this app using agent-browse
    0
    installs
  5. ▌
    Motion Docs · pablopunk
    Documentation and resources for using the Motion animation library with React, Vue, and other frameworks. Provides guides, API references, and examples for creating dynamic web animations.
    0
    installs
  6. ▌
    Context7 CLI · pablopunk bundle
    Use the ctx7 CLI to fetch library documentation, manage AI coding skills, and configure Context7 MCP. Activate when the user mentions "ctx7" or "context7", needs current docs for any library, wants to install/search/generate skills, or needs to set up Context7 for their AI coding agent.
    0
    installs
  7. ▌
    Database Expert · pablopunk
    Expert in SQLite with WAL mode, Drizzle ORM, and better-sqlite3 driver.
    0
    installs
  8. ▌
    Remote Debugger · pablopunk
    Debug this app using agent-browse on a production environment
    0
    installs
  9. ▌
    Backend Developer · pablopunk
    Expert in Astro v5, Drizzle ORM, Docker Compose, OpenCode SDK v2, queue systems, and backend architecture.
    0
    installs
  10. ▌
    Frontend Developer · pablopunk
    Expert in Astro v5, React, shadcn/ui, and Tailwind CSS with semantic color tokens.
    0
    installs
  11. ▌
    Opencode Integration · pablopunk
    Use this agent for the Opencode integration. Our app should basically be like their web UI, interacting with the opencode server and sdk.
    0
    installs
  12. ▌
    Vercel React Best Practices · pablopunk bundle
    React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
    0
    installs
  13. ▌
    UI Design · pablopunk bundle
    Use when designing, building, or reviewing UI in Nevermind — the command palette, extension UIs, settings, onboarding, or any visual surface. Covers visual fundamentals (Refactoring UI), command-palette UX patterns, desktop/Electron/macOS conventions, motion, dark mode, and accessibility. Trigger on requests like "design X", "make this look better", "review the UI", "polish this screen", or any change to a `.tsx`/`.css` file under `src/renderer` or `src/ui`.
    0
    installs
  14. ▌
    Performance · pablopunk
    Use when changing or reviewing performance-sensitive Nevermind paths: command palette search, keyboard input, AI chat streaming, extension views, cache invalidation, IPC, Electron window behavior, file/icon/thumbnail/clipboard work, or any request mentioning lag, latency, responsiveness, jank, render cost, or “performance is UX”. Trigger before making assumptions; explore the repo and identify the hot path first.
    0
    installs
  15. ▌
    Security Audit · pablopunk
    Use when reviewing Nevermind for security risk, threat modeling, secure-code review, dependency/config exposure, secrets, OWASP-style web/API issues, Electron attack surface, auth/session/token/billing abuse, or any request for a penetration-test/security report. Explore the repo before conclusions; this is for authorized review of this app only.
    0
    installs
  16. ▌
    Nevermind Driver · pablopunk
    Use when an agent must open, drive, dogfood, or test the real Nevermind Electron app through its visible UI. Covers palette search, keyboard navigation, commands, action panels, extension views, AI chats, independent windows, screenshots, and multi-step user journeys over CDP with agent-browser.
    0
    installs
  17. ▌
    Extensions UI Test · pablopunk
    Use when testing, reviewing, or polishing Nevermind extension API UI fixtures, host-rendered extension views, or any UI-facing extension API endpoint. Trigger on requests mentioning extension fixtures, Fixtures root item, extension UI tests, dev-only UI fixtures, or visual polish of generated/extension views.
    0
    installs
  18. ▌
    Production Debugger · pablopunk bundle
    Use for Nevermind production incidents, external configuration, or deployed-flow verification — Sentry alerts, Vercel/Axiom logs, backend 5xx, auth failures, Neon/Upstash incidents, upstream AI provider failures, GitHub release failures, desktop prod logs, or any "check prod" request. This is an index skill for vendor-specific operational connectors.
    0
    installs
  19. ▌
    Electron Best Practices · pablopunk
    Use when changing or reviewing Nevermind Electron behavior - BrowserWindow/webPreferences, preload and IPC contracts, custom protocols, permissions, shell/file/URL actions, extension iframes, updater/packaging, platform integration, or any request mentioning Electron specs/best practices/hardening. Complements ui-design's desktop-electron UX notes.
    0
    installs
  20. ▌
    Backend API Compatibility · pablopunk
    Use when changing or reviewing Nevermind desktop/backend contracts - Astro API routes used by desktop, Electron backend fetches, auth/device login, token revoke, active-model descriptors, AI proxy routes, billing/rate-limit/error shapes, compatibility manifests, feature flags, backend deploy policy, desktop release/update interactions, or any request about keeping frontend and backend in sync.
    0
    installs
  21. ▌
    Improve API From Conversations · pablopunk
    Use when improving Nevermind's extension API or builder workflow from recent local AI builder conversations. Review persisted aiChats and generated extension code, then draft actionable GitHub issues for API, host, or builder improvements.
    0
    installs
  22. ▌
    Nevermind Extension Builder · pablopunk
    Builds local Nevermind extensions that expose command-palette commands, declarative UI views, and OS capabilities. Use when the user wants to automate something, create an action, or extend Nevermind.
    0
    installs
  23. ▌
    Web Design · pablopunk
    Use this skill when you need to create new components of the web UI, update them, or the user asks anything web-ui related
    0
    installs