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

upstash-ui-skills

Enforce Upstash UI design rules for colors, Inter font, and 4px grid.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

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

Core Features & Use Cases

  • Consistent Styling: Enforces Upstash's specific color palette, typography (Inter font), and spacing (4px grid).
  • UI Element Guidelines: Provides rules for buttons, inputs, and other common UI components.
  • Use Case: When developing a new feature for a platform that needs to match the look and feel of Upstash's existing products, this Skill ensures the new UI adheres to their established design language.

Quick Start

Apply the Upstash UI design system to a new web component.

Frequently Asked Questions about upstash-ui-skills

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

FAQPage Schema
How do I build a UI that matches the Upstash design system?▼

To build a UI matching the Upstash design system, apply specific constraints including light mode, the Inter font, and a 4px grid. This ensures visual consistency and adherence to their established design language.

What color and typography rules do I need for Upstash-style UI design?▼

Upstash-style UI design requires adhering to semantic color tokens, defined text styles, spacing scales, and border-radius values. Typography specifically utilizes the Inter font to maintain interface consistency.

Can I use this to create a new Upstash-inspired design system from scratch?▼

Yes, you can create a new Upstash-inspired design system from scratch. The rules apply to both developing new design systems and implementing UIs with specific color and typography constraints.

Does the Upstash UI design system support dark mode?▼

No, the Upstash UI design system explicitly enforces light mode. It provides opinionated constraints for building interfaces visually consistent with Upstash's light-themed user experience.

What's the best way to ensure my web components match Upstash's UI styling?▼

The best way to ensure components match Upstash's UI styling is to follow the provided guidelines for buttons, inputs, and common UI components using the 4px grid spacing scale and semantic color tokens.

Related Skills

Explore More Design & Creative Skills→
ihlamuryihlamury
73

gusto-ui-skills

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

Community
Intermediate
skatedduskateddu
27

frontend-design

Generate frontend interfaces with HTML/CSS/JS for React, Vue, or plain websites.

Community
Advanced
ihlamuryihlamury
73

wise-ui-skills

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

Community
Intermediate
0xrafasec0xrafasec
9

rlabs-design

Generate branded Rlabs interfaces and assets using the design system.

Community
Advanced