# Angular Data Grid Installation

> Install CoreUI Data Grid for Angular via npm and load the shared grid stylesheet.

## npm

```sh
npm install @coreui/angular-data-grid
```

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

The `DataGridComponent` is standalone — import it straight into your component:

```ts
import { DataGridComponent } from '@coreui/angular-data-grid'

@Component({
  imports: [DataGridComponent],
  // ...
})
```

Add the grid stylesheet to your global styles (e.g. `angular.json` `styles` or
`styles.scss`):

```scss
@use "@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](https://coreui.io/data-grid/angular/docs/customization/styling/) for the full token reference.

Next: the [Quickstart](https://coreui.io/data-grid/angular/docs/getting-started/quickstart/).