Grid

Customize the background grid lines on the chart.

← Back to Custom Styles overview

Copy the property path into your setCustomStyles config. You only need to include the values you want to change.

Property	Description	Type	Example
grid.show	Show or hide the entire grid	boolean	true
grid.horizontal.show	Show horizontal grid lines	boolean	true
grid.horizontal.color	Color of horizontal lines	color	'#e8e8e8'
grid.horizontal.size	Thickness of horizontal lines	number	1
grid.horizontal.style	Line style for horizontal lines	'dashed' | 'solid'	'dashed'
grid.vertical.show	Show vertical grid lines	boolean	true
grid.vertical.color	Color of vertical lines	color	'#e8e8e8'
grid.vertical.size	Thickness of vertical lines	number	1
grid.vertical.style	Line style for vertical lines	'dashed' | 'solid'	'dashed'

Example

chart.setCustomStyles({
  dark: {
    grid: {
      horizontal: { color: '#333333', size: 1 },
      vertical: { color: '#333333', size: 1 },
    },
  },
})

Developers who need full TypeScript interfaces can use the type reference.