Goo

goo is a full-featured s&box UI framework in C#. structure, style, and behavior in one language.

think about it like this: if markup and stylesheets did the whole job, there'd be no JavaScript. goo exists to consolidate layout, behavior, and styling into one language with a simplified syntax.

Docs: https://obselate.github.io/sbox-goo/docs/ itch.io: https://obselate.itch.io

Agent skill (Claude Code, Codex, and friends)

goo ships a skill for creating goo UI in s&box. install it and the next time you mention goo or creating UI, the skill is invoked. The skill folder is the standard SKILL.md format, so the same files work in any agent that supports agent skills.

Claude Code:

/plugin marketplace add obselate/Goo
/plugin install goo-ui@goo

Codex CLI: copy .claude-plugin/goo-ui/skills/goo-ui/ into ~/.codex/skills/goo-ui (or .codex/skills/goo-ui inside your project), restart Codex, then invoke with $goo-ui or just mention goo. Other agents: copy the same folder into that agent's skills directory.

Quick example

using Goo;
using Sandbox.UI;

namespace Sandbox;

public class CounterUI : GooPanel<Container>
{
	private int _count;

	protected override Container Build() => new Container
	{
		Padding = 16,
		Gap = 12,
		FlexDirection = FlexDirection.Row,
		AlignItems = Align.Center,
		BackgroundColor = Color.White,
		BorderRadius = 12,
		Children =
		{
			new Text( _count.ToString() ),
			new Container
			{
				Padding = 8,
				BorderRadius = 6,
				BackgroundColor = Color.Orange,
				HoverBackgroundColor = Color.Cyan,
				TransitionMs = 150,
				OnClick = e => _count++,   // handler triggers the rebuild automatically
				Children = { new Text( "+" ) },
			},
		},
	};
}

Build() is a pure function of your state. Event handlers trigger a rebuild automatically, so OnClick = e => _count++ is the whole wiring; the reconciler applies only what changed. Hover and focus variants like HoverBackgroundColor resolve engine-side with no rebuild at all.

Mount it

GooPanel<TRoot> is a Sandbox.PanelComponent, so CounterUI is a Component. In the s&box editor:

1. Create a GameObject.
2. Add Component -> ScreenPanel (fullscreen overlay) or WorldPanel (3D worldspace).
3. Add Component -> CounterUI on the same GameObject.
4. Press play.

What is in the box

• Layout: a nested tree of Container/Text nodes with flexbox positioning, plus blobs for images, shapes (Sector, Arc, Polygon), text entry, SVG, web, and 3D scene panels, and Embed for mounting any engine panel the tree does not model.
• Styling: typed style properties on every node, no stylesheet and no class strings; styles are values you can compute inline, with built-in Hover/Active/Focus variants, transitions, and Tokens for lexically scoped theming.
• Reactive state: ordinary C# fields are the source of truth; handlers rebuild automatically, State<T> auto-dirties on writes from timers and callbacks, and Cell gives reusable widgets their own private state.
• Animation: springs, smooths, decays, tweens, and timelines advanced in Tick, sampled in Build; transforms and colors are the cheap per-frame channels.
• HUD scaffolding: Hud.Overlay, Hud.Anchored, Hud.Fill, Hud.Scrim for full-screen layers and corner pinning, Hud.Particles for screen-space ParticleField effects, and Goo.Controls for ready-made buttons, sliders, and popovers.
• Effects and input: custom shaders per panel via ShaderEffect with live Func<T> uniforms, tag-addressed effects through an EffectMap, keyboard tracking with KeyTracker, and drag and drop with DragSource/DropZone/DragLayer.
• Tooling: an opt-in Perf profiler that breaks rebuild cost into build, diff, and apply phases per op kind.

Start with your first panel, or jump to the overview.