> ## Documentation Index
> Fetch the complete documentation index at: https://docs.daily.co/llms.txt
> Use this file to discover all available pages before exploring further.

# VCS: useGrid()

> Developers can use Daily's VCS SDK to build custom video layouts and add graphics to live streamed and recorded video calls.

`useGrid(): Object`

Returns an object describing the composition's base design grid. Learn more about grid units
in the [Layout API docs](/docs/vcs/layout-api#the-grid-unit).

## Return type

| Property            | Type     | Description                                                                  |
| :------------------ | :------- | :--------------------------------------------------------------------------- |
| `pixelsPerGridUnit` | `Number` | This is the scale factor that lets you translate grid units to output pixels |

## Sample code

<Tip>
  Additional examples of usage for this custom hook can be found in the [source code for the VCS SDK](https://github.com/daily-co/daily-vcs).
</Tip>

```javascript theme={null}
import * as React from 'react';
import { Text } from '#vcs-react/components';
import { useGrid } from '#vcs-react/hooks';

  const pxPerGu = useGrid().pixelsPerGridUnit;

  return <Text>There are {pxPerGu} pixels per grid unit</Text>;
}
```
