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
telagod avatar

Applying Ui Design System

telagod/code-abyss

This is a frontend design system selector that gives you four distinct UI aesthetics with complete implementation guides: Glassmorphism (frosted, translucent)…

GitHub stars
224
last updated
Jun 10, 2026
View on GitHubSave

Install

$ npx -y skills add telagod/code-abyss --skill applying-ui-design-system --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

This is a frontend design system selector that gives you four distinct UI aesthetics with complete implementation guides: Glassmorphism (frosted, translucent), Liquid Glass (Apple-style with environmental lighting), Neubrutalism (thick borders, flat shadows, high saturation), and Claymorphism (soft clay with rounded corners). Each style includes CSS tokens, component patterns, dark mode mappings, and accessibility constraints. The guide enforces contrast ratios across all styles, includes focus-visible states, and respects reduced motion preferences. It's built for when you're starting a new project and need to pick a cohesive visual language rather than mixing aesthetics randomly. The Chinese headers in the source are a quirk, but the technical content is solid and the performance warnings about backdrop-filter limits are worth heeding.

Files

Select a file.

Details

Repository
github.com/telagod/code-abyss
Categories
Frontend Development, Documentation, Code Review & Quality, Design & UI/UX
License
MIT
First seen
Jun 11, 2026

More from telagod/code-abyss

All 30
  • Architecting Security
  • Automating Devops
  • Building Agent Systems
  • Checking Code Quality
  • Creating Presentations
  • Cultivating Personas
  • Cultivating Skills
  • Defending Applications
  • Designing Architectures
  • Designing Hardware Products
  • Detecting And Responding
  • Developing Mobile Apps
  • Developing Software
  • Engineering Data Pipelines
  • Generating Docs
  • Indexing Code
  • Operating Kicad Eda
  • Orchestrating Adversarial Reviews
  • Processing Docx
  • Processing Pdfs
  • Provisioning Infrastructure
  • Reducing Aigc Detection
  • Securing Cloud And Supply Chain
  • Securing Systems

Recommended

More Frontend Development
1The1Studio avatarui-ux-pro-maxThe1Studio/theone-training-skillsFrontend UI/UX design intelligence - activate FIRST when user requests beautiful, stunning, gorgeous, or aesthetic interfaces. The primary skill for design deci0installs
2thinkinaixyz avatarfrontend-designthinkinaixyz/deepchatCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, 0installs
3vercel-labs avatarvercel-react-view-transitionsvercel-labs/agent-skillsGuide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view tran0installs
4onmax avatarvueonmax/nuxt-skillsUse when editing .vue files, creating Vue 3 components, writing composables, or testing Vue code - provides Composition API patterns, props/emits best practices7.9Kinstalls
5shadcn avatarmigrate-radix-to-baseshadcn/uimigrate radix to base4.9Kinstalls
6remix-run avatarreact-router-framework-moderemix-run/agent-skillsreact router framework mode3.6Kinstalls