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

brex-ui-skills

Enforce Brex UI design constraints for light-mode interfaces with Inter typography and a 4px grid.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides opinionated constraints and guidelines for building user interfaces that are visually consistent with Brex's design system, ensuring a familiar and polished user experience.

Core Features & Use Cases

  • Aesthetic Consistency: Adheres to Brex's light mode, Inter font, and 4px grid system.
  • Design System Implementation: Offers specific guidance on colors, typography, spacing, and borders.
  • Use Case: When developing a new feature for a financial dashboard that needs to align with Brex's brand identity, use this Skill to ensure all UI elements, from buttons to typography, match the established aesthetic.

Quick Start

Apply the brex-ui-skills to ensure the interface uses light mode, Inter font, and a 4px grid.

Frequently Asked Questions about brex-ui-skills

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

FAQPage Schema
How do I build a Brex-inspired UI with consistent design system constraints?▼

To build a Brex-inspired UI, apply design system constraints enforcing light-mode color palettes, Inter typography, a 4px spacing grid, defined border-radius scales, and accessibility-compliant text contrast for polished visual consistency.

What typography and spacing grid does the Brex design system use for UI development?▼

The Brex design system uses the Inter font family for typography and a 4px grid for spacing layout, ensuring interface elements align consistently and adhere to established brand identity guidelines.

Can I use Brex UI design guidelines for dark mode financial dashboard interfaces?▼

No, the Brex UI design guidelines specifically enforce light-mode interface constraints, including defined color palettes and accessibility standards for text contrast, and do not support dark mode configurations.

How do I ensure accessibility standards for text contrast when styling Brex UI components?▼

Ensure accessibility standards for text contrast by applying the enforced color palettes provided by the Brex design system constraints, which guarantee compliant contrast ratios for light-mode interfaces and interactive states.

What's the best way to standardize border-radius and interactive states in a Brex design system?▼

Standardize border-radius and interactive states by applying the defined border-radius scales and specific guidelines for component styling provided within the Brex design system constraints.

Does the Brex UI design system require any specific dependencies or component libraries to function?▼

No, the Brex UI design system requires no external dependencies or component libraries, functioning purely as opinionated constraints and guidelines for layout, colors, typography, and component styling.

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
v1nizxv1nizx

stitch::extract-design-md

Extract color palettes, typography scales, and component styling patterns from frontend source code.

Community
Advanced
DanielV-94DanielV-94

awwwards-ui-skills

Enforce Awwwards-style UI design guidelines with Inter font and 4px spacing grid.

Community
Intermediate
ihlamuryihlamury
73

loom-ui-skills

Enforce Loom's UI design system with color tokens, Inter font, and 4px spacing grid.

Community
Intermediate