React Splitter

Overview

The React Splitter enables developers to define sections of a page in a column and row structure. Each section can also be resized by simply dragging the provided handlers, and can be expanded and collapsed.

See React Splitter Overview demo

React Splitter - Overview, KendoReact UI Library

Panes

Panes are at the heart of the KendoReact Splitter. Each content area of the React Splitter is a Pane, and each Pane has options to help define dimensions and allow for resizing, collapsing or scrolling on a pane-by-pane basis.

See React Splitter Panes demo

React Splitter - Panes, KendoReact UI Library

Orientation

The KendoReact Splitter allows for each Pane to be arranged either horizontally or vertically.

See React Splitter Orientation demo

React Splitter - Orientation, KendoReact UI Library

Keyboard Navigation

With its built-in Keyboard Navigation, the KendoReact Splitter allows users to navigate between panes and use keyboard interactions to resize panes.

See React Splitter Keyboard Navigation demo

Accessibility

The KendoReact Splitter is compliant with Section 508 and WAI-ARIA standards, and is AAA rated with WCAG 2.0.

See React Splitter Accessibility demo

React Splitter - Accessibility, KendoReact UI Library

Next Steps

Visit Our Demos

See KendoReact in action and check out how much it can do out-of-the-box.

See Pricing

Buy an individual license for KendoReact, or treat yourself to Kendo UI, our complete JavaScript bundle.

Start Free Trial

Try KendoReact with dedicated technical support.