Nykaa

Nykaa's design system is "Fearless, Feminine, and Functional." It is a clean, beauty-first environment that uses its signature pink to create a sense of exci…

High Quality

Join 0+ developers using this skill

skill

Designs

intermediate

0 installs

4/5 quality

View Source

Last updated: June 19, 2026

AI Skill Market Insights

Real data. Real impact.

Popularity

Rising

Emerging

Active Users

Developers

Quick Start

Install Command

Source: https://github.com/whyashthakker/design-md-templates-skills?ref=explainx

TEAR & SHARE

3-5hrs/WK

RISING

0.0K+ USING

Design System: Nykaa

Overview

Nykaa's design system is "Fearless, Feminine, and Functional." It is a clean, beauty-first environment that uses its signature pink to create a sense of excitement and empowerment.

Design Philosophy

The Beauty Counter: The UI is designed to mimic the clarity and organization of a premium beauty counter.
Confident Pink: The Nykaa Pink (#FF1774) is used as a beacon for "Add to Bag" and key interactive states.
Editorial Minimalism: Relies on high-contrast black-on-white text and generous spacing to feel like a modern beauty blog.
Information Transparency: Prioritizes ingredient lists, reviews, and high-resolution swatch photography.

Colors

Nykaa Pink (#FF1774): A vibrant, high-energy pink that represents the brand's bold and playful spirit.
Deep Berry (#9E1547): Used for logo accents and premium sections (Nykaa Luxe) to add a layer of sophistication.
Pure Canvas: Primarily uses absolute White and Black to ensure colors of makeup products are represented accurately.

Typography

Inter: A neutral, clean sans-serif that ensures information density doesn't become visual clutter.
Hierarchy: Uses bold pink headers sparingly to draw attention to special categories and offers.

Components

Swatch Tiles: Small, circular or square tiles that show product shades with high color accuracy.
The "Bag" Drawer: A sleek, right-aligned overlay that provides a quick summary of the shopping cart.
Product Badges: Small, rounded badges for "New," "Best Seller," or "Conscious Beauty" using a muted secondary palette.

Visual Effects

Clean Grids: Organizes thousands of products into a highly structured, easy-to-browse grid.
Soft Hover States: Uses subtle background shifts or pink outlines to indicate interactivity.
High-Resolution Galleries: Prioritizes image loading to ensure beauty details are visible instantly.

Nykaa

AI Skill Market Insights

Quick Start

Install Command

TEAR & SHARE

Tags

Raycast

Be Part of the 0+ Developer Community

Design System: Nykaa

Overview

Design Philosophy

Colors

Typography

Components

Visual Effects

License

MongoDB

NVIDIA

Mintlify

Spotify

Channels

Learn

Compare

Company

Agents