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

# Customizing Nodes

## Set Node Icons

Simply click on the empty icon tile of a node and choose the icon from the menu!

<video muted playsInline controls className="w-full aspect-video" src="https://mintcdn.com/metzsh/fELY9edQkrehV0tS/videos/icons.mp4?fit=max&auto=format&n=fELY9edQkrehV0tS&q=85&s=c0dd8e570c82b5fd11b61209183d1884" data-path="videos/icons.mp4" />

## Change the layout

You can move the nodes anywhere and resize them as well to update the layout the way you want.
<br />You can also click at the color menu at bottom right corner and change the color!

<video muted playsInline controls className="w-full aspect-video" src="https://mintcdn.com/metzsh/fELY9edQkrehV0tS/videos/layouting.mp4?fit=max&auto=format&n=fELY9edQkrehV0tS&q=85&s=036cd7f6145e90fc2f508b03a0a4f00e" data-path="videos/layouting.mp4" />

## Visual Hierarchy

Systems usually have levels and contain components inside components. To achieve the same look in metz, you can use folders!
<br />The folder hierarchy determines the visual hierarchy on playground.

<video muted playsInline controls className="w-full aspect-video" src="https://mintcdn.com/metzsh/fELY9edQkrehV0tS/videos/folders.mp4?fit=max&auto=format&n=fELY9edQkrehV0tS&q=85&s=101d74e758449beee7b0da71423139ca" data-path="videos/folders.mp4" />
