All authors
Claude Skills by Manavarya09
github.com/Manavarya0934 skills2 installs73 views
- Marketplace```markdown --- name: designlang description: Reverse-engineer any website into a complete design system. Outputs DTCG W3C tokens, motion, anatomy, voice, page intent, material language, plus a single agent-native DESIGN.md and a one-command Next.js clone. Use when the user wants to extract, mirror, or compare design tokens against a live URL. when_to_use: | Use this skill when the user wants to: - Extract design tokens, palette, typography, or shadows from a public website - Generate a DEVotes: 0GitHub stars: 4,144
- Extract DesignExtract the full design language from any website URL. Produces 8 output files including AI-optimized markdown, visual HTML preview, Tailwind config, React theme, shadcn/ui theme, Figma variables, W3C design tokens, and CSS variables. Also runs WCAG accessibility scoring. Use when user says 'extract design', 'get design system', 'design language', 'design tokens', 'what colors/fonts does this site use', or '/extract-design'.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for cal.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for clerk.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for coinbase.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for discord.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for duolingo.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for framer.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for loom.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for mintlify.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for netflix.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for perplexity.ai — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for planetscale.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for posthog.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for postman.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for railway.app — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for ramp.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for raycast.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for render.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for replit.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for resend.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for retool.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for sentry.io — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for supabase.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for v0.dev — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- DesignlangUse when styling UI for webflow.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Votes: 0GitHub stars: 4,144
- Cost EstimateEstimate the cost of a task before starting it. Analyzes task complexity, predicts token usage, and compares cost across all Claude models. Use when user says 'estimate cost', 'how much will this cost', 'cost estimate', or '/cost-estimate'.Votes: 0GitHub stars: 36
- Cost GuardianReal-time cost tracking and budget management for Claude Code sessions. Shows current spend, burn rate, budget status, per-tool and per-model breakdown. Use when user says 'cost', 'budget', 'spending', 'how much', 'token usage', 'export', or '/cost-guardian'. Subcommands: budget, resume, reset, config, export, status.Votes: 0GitHub stars: 36
- Cost InsightsAdvanced cost intelligence: efficiency scoring, waste detection, ROI metrics, model savings calculator, anomaly detection, and GitHub badge generation. Use when user says 'insights', 'efficiency', 'waste', 'roi', 'savings', 'anomaly', 'badge', or '/cost-insights'.Votes: 0GitHub stars: 36
- Cost ReportGenerate detailed cost reports with charts and breakdowns. Shows daily/weekly/monthly spend, per-tool costs, per-branch costs, and trends. Use when user says 'cost report', 'spending report', 'usage report', 'show costs', 'branch costs', or '/cost-report'.Votes: 0GitHub stars: 36
- Bullpen LearnUse this skill after a bullpen agent completes a task to extract 0-3 durable learnings (decisions, patterns, preferences, failures, or code snippets) and write them to the project's local memory store (`<project>/.bullpen/memory.json`) under that agent's namespace. The matching Intern agent runs this. Keep each learning self-contained and project-scoped.Votes: 0GitHub stars: 9
- Bullpen MemoryUse this skill before any bullpen agent runs to retrieve relevant past learnings from the project's local memory store. Trigger when an agent activates and needs context from prior sessions — preferences, decisions, patterns, failures, or code snippets stored in their namespace. Memory lives in `<project>/.bullpen/memory.json` — per-project, plain JSON, no daemons.Votes: 0GitHub stars: 9
- Idempotent ApisUse when designing or reviewing any state-changing HTTP endpoint (POST, PUT, PATCH, DELETE) — covers idempotency keys, request deduplication, retry safety, exactly-once semantics over at-least-once delivery, and the Stripe/standard idempotency-key pattern. Use anytime an endpoint creates resources, charges money, sends notifications, or has any non-reversible side effect.Votes: 0GitHub stars: 9
- React RscUse when working with React Server Components — choosing between Server and Client components, designing the server/client boundary, debugging hydration mismatches, fetching data on the server, using Server Actions, optimizing initial load, or migrating from a Pages Router or pure client-side React app to App Router + RSC.Votes: 0GitHub stars: 9