demo · v143 · graphics
UBO struct editor
Add fields to a WGSL struct, choose types, toggle between std140 and packed layout rules, and instantly see byte offsets, padding, the generated WGSL struct declaration, and matching JavaScript ArrayBuffer write code. Validate against the real WebGPU device limits in one click.
Presets
Layout
Fields
Name
Type
Align override
Byte layout
| Field | Type | Align | Size | Offset | Padding after |
|---|
Total struct size: 0 bytes
Generated WGSL
Generated JavaScript (ArrayBuffer writes)
Validate with WebGPU
Creates a real GPUBuffer with UNIFORM usage at the computed struct size and checks device limits.
Click Validate to test against the real WebGPU device.