React Data Grid Installation

Installation

Install CoreUI Data Grid for React via npm and load its stylesheet.

On this page

npm

npm install @coreui/react-data-grid

Data Grid ships its stylesheet in the @coreui/data-grid package (installed automatically as a dependency) and layers on the .table styles from @coreui/coreui or @coreui/coreui-pro (≥ 5), so make sure one of them is loaded on the page.

import { CDataGrid } from '@coreui/react-data-grid'
import '@coreui/data-grid/dist/css/data-grid.css'

Stylesheet

The grid’s CSS defines --cui-data-grid-* custom properties that resolve through CoreUI’s semantic variables, so it inherits your theme (including data-coreui-theme="dark") automatically. See Styling & theming for the full token reference.

Next: the Quickstart.