https://github.com/sentrygunlv3/zuil
WIP GUI framework written in zig
https://github.com/sentrygunlv3/zuil
framework gui gui-library retained-mode-gui zig zig-package ziglang
Last synced: 3 days ago
JSON representation
WIP GUI framework written in zig
- Host: GitHub
- URL: https://github.com/sentrygunlv3/zuil
- Owner: sentrygunlv3
- License: mpl-2.0
- Created: 2025-12-26T21:28:55.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2026-06-05T18:07:06.000Z (7 days ago)
- Last Synced: 2026-06-05T20:06:32.549Z (7 days ago)
- Topics: framework, gui, gui-library, retained-mode-gui, zig, zig-package, ziglang
- Language: Zig
- Homepage:
- Size: 486 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
ZUIL
> [!CAUTION]
> WIP
> [!IMPORTANT]
> NOT TESTED ON WINDOWS\
> the `build.zig` links some libraries as system libraries\
> which i assume doesnt work on windows
---
ZUIL (Zig UI Library)
retained mode gui framework written in zig
using `sdl3`, `zopengl`, `plutosvg`, `harfbuzz` and `freetype` libs
---

### current plan
rendering:\
replace renderer with a painter interface system and allow casting to the actual backend if its a know type for more advanced stuff
## examples
### widgets
widgets are created using builder functions
```zig
// .c for common builder functions
widgets.container()
.c.size(.{.dp = 1200}, .{.percentage = 1})
.color(colors.WHITE)
.child(
widgets.list()
.c.size(.fill, .fill) // fill is same as .{.percentage = 1}
.direction(.vertical)
.spacing(1)
.children(.{
widgets.icon()
.c.size(.{.dp = 200}, .{.dp = 200})
.c.keepSizeRatio(true)
.icon("icon.svg")
.build(),
widgets.container()
.c.size(.{.dp = 50}, .{.dp = 30})
.c.eventCallback(containerClick) // fn (*ZWidget, *const ZEvent) callconv(.c) c_int
.color(colors.rgb(0, 1.0, 0.5))
.build(),
widgets.container()
.c.size(.{.pixel = 50}, .{.dp = 30})
.build(),
widgets.container()
.c.size(.{.mm = 50}, .{.dp = 30})
.build(),
widgets.container()
.c.size(.{.percentage = 0.5}, .{.dp = 30})
.build(),
})
.build()
)
.build();
```
### test project
there is a test/example project in the `test` directory
keybinds:
- `space`: change the background color
- `F1`: spawn a new window
## project structure
directories in `src` dir:
- `core` has the base widget system
- `app` has sdl3 specific things and can be used to create windows that use the core widget system
- `widgets` has the default widgets