Claude Marketplaces
SkillsMCP serversMarketplacesDigestTools
Submit

This week in Claude

Every Monday: Claude Code, Agent SDK, MCP, and the Anthropic platform moves worth your time.

Skills by category
Frontend DevelopmentBackend & APIsTesting & QASecurityDevOps & CI/CDGit & Pull RequestsDocumentationCode Review & QualityAI & Agent BuildingSkill Development
MCP servers by category
Sales & MarketingWeb & Browser AutomationDatabasesAI & LLM ToolsCloud & InfrastructureCommunication & MessagingDeveloper ToolsDesign & CreativeDocuments & KnowledgeSearch & Web Crawling
Marketplaces by category
AI Agents & OrchestrationLLM IntegrationDevelopment ToolsFrontend & UIBackend & APIsDatabasesTesting & Code QualityDevOps & CloudSecurity & ComplianceGit & Version Control
Claude Marketplaces

An independent directory of skills, plugins and MCP servers for Claude Code. Not affiliated with Anthropic.

Browse

  • Skills
  • MCP servers
  • Marketplaces
  • Weekly digest
  • Skill index
  • MCP index
  • Marketplace index

Site

  • About
  • Tools
  • Submit
  • Feedback
  • Privacy
  • llms.txt
  • Plugins reference

Maker

  • Agent Caffeine
  • knobs
  • Wax
  • Snug
  • mertduzgun.com
Made by mertduzgun.com
Skills/Frontend Development
zhixiangluo avatar

Discover Ui Surface

zhixiangluo/10xproductivity

Before you write Playwright scripts for something like LinkedIn or Notion, run through the flow once with this and it'll build you a map of what selectors…

GitHub stars
357
last updated
Jun 11, 2026
View on GitHubSave

Install

$ npx -y skills add zhixiangluo/10xproductivity --skill discover-ui-surface --agent claude-code

Installs into .claude/skills of the current project.

Sponsors

CodeRabbitSponsoredTry For FreeLid closed, agents workingTry itOpen StepsSponsoredDownload for freeAppSignalSponsoredStart Free TrialKeep API keys from agentsGet SnugBlock apps on your iPhoneGet WaxDevtools for design engineersTry it livebelt - the only tool your agent needsSponsoredone prompt install

What it does

Before you write Playwright scripts for something like LinkedIn or Notion, run through the flow once with this and it'll build you a map of what selectors actually work and which API calls fire when you click things. It's the difference between guessing at CSS selectors in a React app and having a tested reference. Three modes depending on how much detail you need: Chrome DevTools Recorder if you just want the basics fast, Playwright observer for richer capture, or Playwright codegen plus trace for the full structured output. Saves you from that painful cycle of write script, run it, watch it break on a data-testid that changed yesterday.

Files

Select a file.

Details

Repository
github.com/zhixiangluo/10xproductivity
Categories
Frontend Development, Backend & APIs, Testing & QA, Documentation, Automation & Workflows, Design & UI/UX, Office & Documents
License
MIT
First seen
Jun 11, 2026

More from zhixiangluo/10xproductivity

All 7
  • Enterprise Search
  • Linkedin Engagement
  • Tool Connector
  • Assistant Orchestrator
  • Colleague Distillation
  • Create Workflow

Recommended

More Frontend Development
1nextlevelbuilder avatardesign-systemnextlevelbuilder/ui-ux-pro-max-skillToken architecture, component specifications, and slide generation. Three-layer tokens (primitive→semantic→component), CSS variables, spacing/typography scales,41.1Kinstalls
2nextlevelbuilder avatarslidesnextlevelbuilder/ui-ux-pro-max-skillCreate strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.37.3Kinstalls
3ibelick avatarfixing-motion-performanceibelick/ui-skillsAudit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects. Use when animations stutte26.2Kinstalls
4onmax avatarreka-uionmax/nuxt-skillsUse when building with Reka UI (headless Vue components) - provides component API, accessibility patterns, composition (asChild), controlled/uncontrolled state,7.3Kinstalls
5onmax avatarmotiononmax/nuxt-skillsUse when adding animations with Motion Vue (motion-v) - provides motion component API, gesture animations, scroll-linked effects, layout transitions, and compos2.3Kinstalls
6plugin87 avatardesign-codeplugin87/ux-ui-agent-skillsGenerate production-ready, accessible, token-driven component code for ANY framework — React+Tailwind, Next.js, SwiftUI, Vue, Svelte, Angular, Solid, Web Compon493installs