---
description: What the path object class is and what it does.
title: Path object
image: images/blockly_banner.png
---

# Path object

The [`PathObject`][PathObject] contains the SVG elements in the DOM
that make up the block.

For example, in the [Geras][built-in-renderers] renderer, blocks have a "main"
path, a "dark" path and a "light" path, to give them a 3d effect. The
path object creates the SVG elements for each of these paths.

![geras paths][geras-paths-image]

This is opposed to the [Thrasos][built-in-renderers] renderer, whose blocks
have a single path element with a stroke:

![thrasos paths][thrasos-paths-image]

It also handles:

- Applying the shape generated by the [drawer][drawer] to the SVG elements.
- Applying [theme colors][theme] to the SVG elements.
- Applying other styling to the SVG elements.

[PathObject]: /reference/blockly.blockrendering.pathobject
[theme]: /guides/configure/appearance/themes#block-style
[built-in-renderers]: /guides/create-custom-blocks/renderers/overview#built-in-renderers
[drawer]: /guides/create-custom-blocks/renderers/concepts/drawer
[geras-paths-image]: /images/rendering/renderers/geras-paths.png
[thrasos-paths-image]: /images/rendering/renderers/thrasos-paths.png
