arca-ui

Resizable

Sculpted panels with recessed grooves that can be resized by dragging the tactile handles.

Horizontal Layout

Drag the handle between panels to resize horizontally.

Panel One
Panel Two

With Grip Handle

A visible grip handle provides clear affordance for resizing.

Sidebar
Main Content

Vertical Layout

Panels stacked vertically with horizontal resize handle.

Header Panel
Content Panel

Three Panel Layout

Multiple resizable sections with independent handles.

Navigation
Editor
Properties

Nested Panels

Complex layouts with nested horizontal and vertical panels.

Sidebar
Main View
Terminal / Output

With Content

Resizable panels containing actual content elements.

File Explorer

  • src/
  • components/
  • pages/
  • utils/
  • public/
  • package.json
  • tsconfig.json

Preview

Select a file from the explorer to preview its contents here.

The panels can be resized by dragging the handle between them.