skills.rest
samura-dev
samura-devCOMMUNITY
Explore all skills by this author →
GitHub

designer

Generate premium UI/UX interfaces with glassmorphism, fluid typography, and avant-garde layouts.

Updated Mar 4, 2026
Search Tags:#design#layout#frontend#ui/ux#animations#glassmorphism#aesthetics
One-click install
npx skills add https://github.com/samura-dev/antigravity-kit --skill designer-samura-dev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: designer
Source: https://github.com/samura-dev/antigravity-kit/tree/main/.agent/skills/designer
Command: npx skills add https://github.com/samura-dev/antigravity-kit --skill designer-samura-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the need for creating exceptionally high-quality, visually stunning, and emotionally engaging user interfaces that go beyond standard design practices.

Core Features & Use Cases

  • Premium Visuals: Implements advanced techniques like true Glassmorphism, sophisticated lighting effects, and organic noise for a luxurious feel.
  • Fluidity & Motion: Utilizes clamp() for responsive typography and spacing, and physics-based animations for micro-interactions.
  • Avant-Garde Layouts: Moves beyond rigid grids to incorporate negative space, asymmetry, and overlapping elements for unique compositions.
  • Use Case: Design a landing page for a new tech product that needs to convey innovation, sophistication, and a cutting-edge feel, aiming for recognition on platforms like Awwwards.

Quick Start

Design a premium UI component for a user profile card, focusing on glassmorphism and subtle animations.

Frequently Asked Questions about designer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create an Awwwards-level UI with glassmorphism and fluid typography?▼

To create an Awwwards-level UI, use advanced design principles like true Glassmorphism 2.0, sophisticated lighting, and fluid typography with clamp() for responsive scaling to achieve premium aesthetics.

What are the best practices for designing avant-garde layouts with asymmetry?▼

Designing avant-garde layouts requires moving beyond rigid grids to incorporate negative space, asymmetry, and overlapping elements, utilizing ample whitespace for unique and emotionally engaging compositions.

How does clamp() work for responsive typography in premium frontend design?▼

The clamp() function enables fluid typography and spacing by allowing font sizes to scale dynamically across viewports, ensuring seamless responsiveness without media queries in premium frontend design.

Why should I avoid default web colors and purple in UI/UX design?▼

Avoiding default web colors and purple in UI/UX design adheres to strict prohibitions that prevent generic aesthetics, ensuring your interface maintains a luxurious, sophisticated, and cutting-edge feel.

Can I generate physics-based micro-interactions for a user profile card?▼

Yes, you can generate physics-based micro-interactions for a user profile card by applying advanced animation principles that provide fluid motion and a premium, emotionally engaging user experience.

What is true Glassmorphism 2.0 and when do I need it for a tech landing page?▼

True Glassmorphism 2.0 is an advanced visual technique using sophisticated lighting and organic noise to create a luxurious feel, needed for tech landing pages conveying innovation and sophistication.

Related Skills

Explore More Design & Creative Skills→
asalhamedasalhamed

ux-researcher

Analyze user needs into personas, journey maps, and usability requirements.

Community
Advanced
melvinv007melvinv007

classey-ui

Implement consistent Classey UI/UX with CSS variables, glassmorphism, and Framer Motion.

Community
Advanced
Aurora-AIAurora-AI
1

antigravity-skills

Transforms static HTML into cinematic, web-ready experiences using Draupnir's spectral powers.

Community
Advanced
huangzidahuangzida
2

industrial-brutalist-ui

Automate industrial brutalist UI development with grid-based layouts and CSS/SVG effects.

Community
Advanced