designing-gnome-ui

Align GNOME UI designs with GNOME HIG guidelines for GTK 4/libadwaita and Qt/PySide6.

2|Updated Jan 13, 2026
One-click install
npx skills add https://github.com/mhagrelius/dotfiles --skill designing-gnome-ui
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: designing-gnome-ui
Source: https://github.com/mhagrelius/dotfiles/tree/main/.claude/skills/designing-gnome-ui
Command: npx skills add https://github.com/mhagrelius/dotfiles --skill designing-gnome-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

GNOME UI design often requires strict adherence to HIG and platform patterns; this Skill provides a structured guide to help designers and engineers align decisions with GNOME conventions before coding.

Core Features & Use Cases

  • HIG-aligned container, navigation, and control patterns for GTK 4/libadwaita and Qt/PySide6 styling.
  • Typography, color, spacing, and accessibility guidelines to ensure consistent, inclusive UIs.
  • Real-world use: review existing GNOME apps for HIG compliance, then implement or refine UI components.

Quick Start

Review the GNOME HIG references and start applying patterns to your GNOME UI design tasks.

Frequently Asked Questions about designing-gnome-ui

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

FAQPage Schema
How do I align my GTK 4 app with GNOME HIG guidelines?

Align GNOME UI by enforcing container, navigation, control, typography, accessibility, and color rules defined in the GNOME HIG references for GTK 4/libadwaita. It provides structured guidance for design, implementation, and review contexts.

Can I use GNOME HIG patterns for Qt or PySide6 styling?

GNOME HIG patterns apply to Qt/PySide6 styling, extending beyond GTK 4/libadwaita. The Skill enforces navigation, control, and typography guidelines to ensure consistent, inclusive UIs across these frameworks.

What's the best way to review an existing GNOME app for HIG compliance?

Review existing GNOME apps for HIG compliance by checking container, navigation, and control patterns against the gnome-hig-reference.md and gnome-advanced-patterns.md, then implement or refine UI components based on findings.

What accessibility and typography rules does GNOME HIG enforce?

GNOME HIG enforces typography, color, spacing, and accessibility guidelines to ensure consistent, inclusive UIs. These rules are applied during design and implementation to align decisions with GNOME conventions before coding.

Does GNOME UI design require libadwaita for HIG compliance?

While libadwaita is the primary framework for GNOME HIG compliance in GTK 4, the Skill also supports Qt/PySide6 styling, enforcing the same container, navigation, and control patterns across both frameworks.

When should I not use GNOME HIG patterns for my application?

GNOME HIG patterns are specifically tailored for GNOME platform applications. If your app targets a different desktop environment or platform, these container, navigation, and control conventions may not align with those design expectations.