# KendoReact Grid Custom Cells Overview

The KendoReact Grid provides the option to override its internal components by allowing you to customize its different types of cells.

<CtaPanelOverview></CtaPanelOverview>

> Starting with KendoReact 5.14.0, you can apply more customizations to the Grid with a new set of properties. The previously available props such as the GridColumn [`cell`](https://www.telerik.com/kendo-react-ui-develop/components/grid/api/gridcolumnprops) prop or the Grid [`cellRender`](https://www.telerik.com/kendo-react-ui-develop/components/grid/api/gridprops) callback are deprecated as of version 9.4.0 of KendoReact.

## Getting Started with the KendoReact Grid Custom Cells

The Grid has a [`cells`](https://www.telerik.com/kendo-react-ui-develop/components/grid/api/gridprops#cells) property that provides the option to add a template to every single cell in the Grid infrastructure separately. In addition, the `cells` prop is also available for the GridColumn component, and is useful if you want to configure the cells of an individual column.

The cell types you are able to customize through the `cells` prop are:

* [Data Cells](https://www.telerik.com/kendo-react-ui-develop/components/grid/cells#add-basic-custom-data-cells)
* [Group Header, Group Footer, Header, Footer, and Filter Cells](https://www.telerik.com/kendo-react-ui-develop/components/grid/cells/header-footer-filter-cells)
* [Edit Cells](https://www.telerik.com/kendo-react-ui-develop/components/grid/cells/edit-cells)
* [Hierarchy Cells](https://www.telerik.com/kendo-react-ui-develop/components/grid/cells/hierarchy-cells)
* [Data Cells](https://www.telerik.com/kendo-react-ui-develop/components/grid/cells)

## Add Basic Custom Data Cells

All the bellow customizations can be done on the GridColumn level using its [`cells`](https://www.telerik.com/kendo-react-ui-develop/components/grid/api/gridcolumnprops#cells) property that gives you full freedom over the cell rendering.

In the following example, a custom data cell renderers are implemented for the GridColumn with the `Discontinued` field.

[Demo Source](https://demos.telerik.com/kendo-react-ui/grid/basic-custom-cell/func/source.txt)

## KendoReact Grid Custom Cells APIs

* [Grid Cells Prop](https://www.telerik.com/kendo-react-ui-develop/components/grid/api/gridprops#cells)
* [GridColumn Cells Prop](https://www.telerik.com/kendo-react-ui-develop/components/grid/api/gridcolumnprops#cells)
* [API Reference of the GridCellsSettings](https://www.telerik.com/kendo-react-ui-develop/components/grid/api/gridcellssettings)

## Suggested Links

* [Grid Custom Group Cells](https://www.telerik.com/kendo-react-ui-develop/components/grid/cells/group-cells)
* [Grid Custom Selection Cells](https://www.telerik.com/kendo-react-ui-develop/components/grid/cells/selection-cells)
