skills.rest
ihlamury
ihlamuryCOMMUNITY
Explore all skills by this author →
𝕏@yagizihlamurGitHub

mem-ui-skills

Enforce Mem's UI design system with Inter font and a 4px grid.

73|9|Updated Jan 25, 2026
Search Tags:#typography#design system#color palette#ui design#light mode#mem
One-click install
npx skills add https://github.com/ihlamury/design-skills --skill mem-ui-skills
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mem-ui-skills
Source: https://github.com/ihlamury/design-skills/tree/main/skills/mem
Command: npx skills add https://github.com/ihlamury/design-skills --skill mem-ui-skills

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides opinionated constraints for building user interfaces that are visually consistent with Mem's aesthetic, ensuring a cohesive and branded user experience.

Core Features & Use Cases

  • Design System Adherence: Enforces specific color palettes, typography, spacing, and border-radius rules.
  • Light Mode Focus: Optimized for light-mode interfaces with a defined background color.
  • Font Consistency: Mandates the use of the Inter font family with specific weights and sizes.
  • Use Case: When an AI agent needs to design a new feature for a product that should look and feel like Mem, it can use this Skill to ensure all UI elements, from buttons to text, adhere to Mem's established design language.

Quick Start

Apply the mem-ui-skills to ensure the new interface uses Inter font and a 4px grid.

Frequently Asked Questions about mem-ui-skills

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

FAQPage Schema
How do I enforce a UI design system for light mode using the Inter font and a 4px grid?▼

To enforce a UI design system for light mode, apply constraints that mandate the Inter font family and a strict 4px grid for layout. This ensures front-end interfaces maintain consistent typography, spacing scales, and visual branding.

What color tokens and typography styles are needed to build a Mem-style interface?▼

Building a Mem-style interface requires specific color tokens for light mode backgrounds, typography styles with defined Inter font weights and sizes, and standardized border-radius values to ensure visual cohesion.

Can I use this design system constraint for dark mode UI design?▼

This design system constraint is specifically optimized for light-mode interfaces with a defined background color. It focuses on providing a cohesive light mode aesthetic and does not enforce dark mode UI rules.

How do I apply design system constraints to front-end components like buttons and text?▼

Apply design system constraints by enforcing specific color palettes, typography rules, and border-radius values across all front-end elements. This ensures buttons, text, and layout patterns adhere to the established visual language.

What is the best way to maintain spacing scale and layout pattern consistency in UI design?▼

The best way to maintain spacing scale and layout consistency is to enforce a 4px grid system. This provides a strict mathematical baseline for all spacing and layout patterns, ensuring cohesive front-end design.

Does this Mem UI design skill require any external dependencies or component libraries?▼

This Mem UI design skill operates with no external dependencies or component libraries. It functions purely as an opinionated set of design system constraints applied directly to your front-end development and UI/UX tasks.

Related Skills

Explore More Design & Creative Skills→
aaravjj2aaravjj2

ui-ux-pro-max

Generate design system artifacts with color, typography, and UX guidelines.

Community
Advanced
ihlamuryihlamury
73

gusto-ui-skills

Enforce Gusto's UI design system constraints for light-mode interfaces.

Community
Intermediate
ihlamuryihlamury
73

mailchimp-ui-skills

Enforce Mailchimp UI design constraints with light mode, Inter font, and 4px grid.

Community
Intermediate
ihlamuryihlamury
73

ramp-ui-skills

Enforce Ramp UI design constraints for light-mode interfaces with Inter font and 4px grid.

Community
Intermediate