GitHub - ovenpasta/adi2: A modern GUI library for Ada: CSS styling, XML UI, SDL3

A modern GUI library for Ada. Adi2 gives you a real widget toolkit with the niceties developers expect from a modern UI stack — CSS-like styling with live reload, declarative XML layouts, animations, SVG and Lottie graphics, internationalization, and asset bundling — implemented natively in Ada on top of SDL3. Status: in production use, but not yet a stable release — APIs may still change between versions. Why Adi2? Style your UI like the web. Selectors, pseudo-classes, parts, transitions, gradients, box shadows — all in a familiar .css syntax. Edit the file, save, see the change. No recompile during development. Prefer pure Ada? CSS rules are just plain Ada aggregates of Style_Rules — write them by hand with no extra ceremony (see the snippet below). Describe UIs declaratively — or don't. Write <button>, <grid>, <text-editor> in XML and let the toolchain emit clean Ada packages, or construct the same widget tree directly in Ada with handle-based builders. Both paths target the exact same API; the XML generator is a convenience, not a requirement. Render rich content. A built-in lightweight HTML view widget renders documentation-style markup with cascading styles. Raster images through SDL3_image, SVG through the bundled plutosvg, Lottie animations through bundled rlottie. Ship a single binary. Bundle every CSS file, font, image, translation, and SVG sprite into your executable. No filesystem dependencies at runtime. Speak the user's language. Gettext-compatible i18n with plural forms, automatic locale detection, and .po → Ada compilation. Animate without boilerplate. CSS transitions on color, background-color, border-color, border-width, border-radius, padding, margin, opacity, box-shadow and font-size — the framework handles interpolation and timing. HiDPI-ready units. dp/dip for layout, rem for typography, pix when you mean one renderer pixel exactly, and px — which follows the display scale or not, depending on Set_Px_Maps_To_Dip. See docs/css_styling.md. Built for tooling and automation. A development-only MCP bridge lets editors and AI assistants screenshot the running app, walk the widget tree, and drive it — clicking buttons, typing into inputs, moving focus, reading performance counters. Great for end-to-end tests written by your AI of choice. Runs in the browser. The examples compile to WebAssembly with GNAT-LLVM and Emscripten — try them live, or see wasm/ for the build. What that costs to ship A release build links statically into a single executable under 10 MB — the widget toolkit, the CSS engine, SVG and Lottie rendering, all of it. Whatever assets you bundle add their own weight to that. It draws through SDL's renderer, which binds to whatever the host offers: Direct3D on Windows, Metal on macOS, Vulkan or OpenGL where they exist, software as the floor. Windows XP takes Direct3D 9 and a current Mac takes Metal, from the same source.

Each of the others buys its size with a large ecosystem and years of production use — the trade Adi2 offers is a single file you can hand to someone, on hardware the others have moved past. Screenshots hello_example material_demo html_view_example rlottie_example assets_example Full gallery of every example: docs/gallery.md. Or run them yourself, in the browser: live demos. A taste Declarative path — XML + CSS /* examples/css/hello_example.css */ .primary { background-color: rgb(37, 99, 235); border-radius: 8px; padding: 10px 16px; transition: background-color 150ms ease-out; } .primary:hover { background-color: rgb(29, 78, 216); } .primary::label { color: white; font-size: 14px; font-weight: 500; } <!-- examples/xml/hello_example.xml --> <adi> <link rel="stylesheet" href="examples/css/hello_example.css"/> <callback name="On_Hello_Click" type="Adi.Widget.Button.Click_Callback"/> <window title="Hello, Adi" width="320" height="180"> <box class="root"> <label text="Welcome to Adi" class="welcome"/> <button text="Click me" class="primary" on-clicked="On_Hello_Click"/> </box> </window> </adi> The toolchain emits a typed Ada package you instantiate from your main — see examples/hello_example.adb for the full ~25-line program. Same thing, written by hand in Ada The CSS rule above is just an aggregate. The XML widget tree is just a few constructor calls. Both paths land on the same API — see examples/hello_raw_example.adb for the full equivalent program. The shape of the styling code is: function Style return Style_Builder renames Adi.Widget_Styles.Create; -- Equivalent of .primary base + :hover from hello_example.css Primary_Base : constant Style_Rules := (Background_Color => Set_Bg (RGB (37, 99, 235)), Border_Radius => Set (Radius (Px (8.0))), Padding => Set (CSS_Box (Px (10.0), Px (16.0))), Transition => Set ((Duration => 0.15, Easing => Ease_Out, Properties => Props (Prop_Background_Color))), others => <>); Primary_Hover : constant Style_Rules := (Background_Color => Set_Bg (RGB (29, 78, 216)), others => <>); -- Wire base + hover to the button's Main_Part Set_Part_Style (Widget_Handle'(+Btn), Main_Part, Style.Base (Primary_Base).On_Hover (Primary_Hover).Build); Build and run either flavour: tools/build_examples.sh hello_example hello_raw_example ./examples/bin/hello_example # XML + CSS pipeline ./examples/bin/hello_raw_example # pure hand-written Ada Quick start # Build the library alr build -- -j0 # Build and run the test suite tools/run_tests.sh # Build all example programs tools/build_examples.sh # ...or just one tools/build_examples.sh stack_example # Try a demo ./examples/bin/material_demo ./examples/bin/html_view_example To use Adi2 from your own project, with "adi.gpr" — SDL linker options come with it. The library's public specs use Ada 2022 constructs, so units that with Adi.* packages need pragma Ada_2022; or -gnat2022. Starting your own project? docs/getting_started.md walks from an empty directory to a working window, in XML/CSS and again in plain Ada. Full build instructions, including building without Alire, in docs/build.md and docs/gprbuild_without_alire.md. Roadmap CSS. Broader CSS surface — more standard properties, selectors and values. HTML view. Tables — table, tr, td/th, column widths, spanning. Flex and grid — display: flex and display: grid inside the document. Widgets and themes. More widgets — tree view, data grid, menu bar, progress and busy indicators, tooltips, split panes, date and colour pickers. Ready-made themes — Material, Fluent, Adwaita and macOS, each in light and dark. Text and reach. Right-to-left and bidirectional text — direction and bidi reordering. Accessibility — semantic roles, names and states to screen readers over AT-SPI, UI Automation and NSAccessibility. Portability. Pluggable backends — an abstraction layer that lets Win32/Direct2D, Cocoa, GLFW, raylib or Skia take the place of SDL3 (design notes). Embedded devices Authoring and tooling. Visual designer — RAD IDE like experience, edit both the UI XML and CSS. Scripting with HAC — embed the HAC Ada compiler for reloadable application logic. Live reload for XML UIs — XML widget trees hot-reload as CSS already does. Better generated docs — browsable API documentation with gnatdoc. Correctness and API. Better callbacks — a callback that fails leaves the app running, callbacks that fire once, and background work that talks to the UI safely (design notes). Contracts — Pre/Post/Type_Invariant and SPARK-mode subsets. C API — a stable C-callable interface for non-Ada callers. Have an idea? Open an issue (see CONTRIBUTING.md for the policy).