# Responsive UI

Use when handling multiple resolutions, stretch modes, aspect ratios, DPI scaling, and...

- Repository: https://github.com/jame581/GodotPrompter (914 stars)
- Category: Engineering
- License: MIT
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add jame581/GodotPrompter --skill responsive-ui -g -a claude-code -y`
Codex: `npx skills add jame581/GodotPrompter --skill responsive-ui -g -a codex -y`
Cursor: `npx skills add jame581/GodotPrompter --skill responsive-ui -g -a cursor -y`
Gemini CLI: `npx skills add jame581/GodotPrompter --skill responsive-ui -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add jame581/GodotPrompter`

## Description

Use when handling multiple resolutions, stretch modes, aspect ratios, DPI scaling, and mobile/desktop adaptation

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Responsive UI in Godot 4.3+

All examples target Godot 4.3+ with no deprecated APIs. GDScript is shown first, then C#.

> **Related skills:** **godot-ui** for Control node layout and themes, **export-pipeline** for platform-specific export settings, **godot-project-setup** for initial project resolution settings, **input-handling** for touch vs desktop input adaptation, **localization** for layout adjustments per locale, **mobile-development** for safe-area and notch handling.

---

## 1. Project Settings for Resolution

Configure base resolution and stretch behaviour in `Project > Project Settings > Display > Window`.

Key settings and their keys in the `[display]` section of `project.godot`:

| Setting | project.godot key | Recommended value |
|---|---|---|
| Viewport width | `window/size/viewport_width` | `1920` (or your base design width) |
| Viewport height | `window/size/viewport_height` | `1080` (or your base design height) |
| Stretch mode | `window/stretch/mode` | `canvas_items` (most games) |
| Stretch aspect | `window/stretch/aspect` | `expand` (fill screen) or `keep` (letterbox) |
| Scale factor | `window/stretch/scale` | `1` |
| Scale mode | `window/stretch/scale_mode` | `fractional`; `integer` for pixel art |

> **Godot 4.7+:** Projects **newly created** in Godot 4.7 already default `display/window/stretch/mode` to `canvas_items` and `display/window/stretch/aspect` to `expand` (previously `disabled` / `keep`), the recommendations above are now the out-of-the-box values. Projects created on older versions are unchanged (the property default is still `disabled`), so set both explicitly when upgrading. See the [4.7 migration guide](https://docs.godotengine.org/en/latest/tutorials/migrating/upgrading_to_godot_4.7.html).

The engine reads these settings once at startup; changing them with `ProjectSettings.set_setting()` later has no effect. At runtime, set the matching `Window` properties instead:

**GDScript:**

The rest: https://github.com/jame581/GodotPrompter/blob/HEAD/skills/responsive-ui/SKILL.md