KendoReact

React Splitter

  • Flexible and fully accessible yet simple React Splitter component: resize, collapse or scroll any pane (content area).
  • Part of the KendoReact library along with 100+ professional UI components built with React for React, from the ground up.
  • Get started quickly with our award-winning support, detailed documentation, interactive demos and instructor-led training.
  • 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 Accessibility - KendoReact

All KendoReact Components

waves bg

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.