# Block

Starting with the **Block** editor is a great way to start learning how to use VoxEdit!

## Creating Blocks

Blocks are used to create terrain, paths, large structures, and more in The Sandbox. You can paint colours onto the sides of a 32x32x32 voxel block and [upload](/en/creator/voxedit/upload-assets-to-workspaces.md) to use it in [Game Maker](/en/creator/game-maker/create-experiences.md).

Use various tools in a paint-only mode with the default palette or custom colours. Controls make it easy to visualize your project, create patterns, refine your design, and optimize your workflow.

{% tabs %}
{% tab title="About" %}
{% embed url="<https://youtu.be/WqTJErRaV2s>" %}
{% endtab %}

{% tab title="What Can I Make?" %}

### What Can I Make?

<figure><img src="/files/fomwOoh8NMf1yTeXItLm" alt=""><figcaption><p>Examples (click to expand)</p></figcaption></figure>

Paint the 6 faces of a cube to create custom solid or liquid blocks with varying levels of transparency in a variety of art styles. Use emissive colours to add glowing details.

You can make tileable (repeatable) textures with a single block or create a set of similar blocks to use together for larger patterns or deign purposes.

{% hint style="warning" %}
You can not add, move, or remove voxels from a block in VoxEdit.
{% endhint %}
{% endtab %}

{% tab title="Collisions, Colours & Transparency" %}

### Collisions, Colours & Transparency

{% hint style="info" %}
Once a block is painted in VoxEdit, you can upload it to make it **solid** or **liquid** and set **transparency**.
{% endhint %}

Blocks can be varied to have:

* **Solid** or **Liquid** collisions
* **Normal** or **Emissive** colours
* **Transparency** in increments of 20\
  0% transparency is opaque, and 80% transparency is near invisible

<figure><img src="/files/MC7mQD8Q25YqSH3fzI95" alt="" width="375"><figcaption><p>A comparison of blocks as they appear in Game Maker</p></figcaption></figure>

{% hint style="info" %}
Emissive colours are applied in VoxEdit to create a light bloom around a block or asset. Light logic may also be applied near the block or asset to shine a similar light color on nearby blocks and objects.
{% endhint %}
{% endtab %}

{% tab title="How Do I Use My Creations?" %}

### How Do I Use My Creations?

Once your block is painted, you can upload it to your Workspace and set properties for how it will look and feel in The Sandbox Game. Then it's ready to test and use in Game Maker!

<table data-column-title-hidden data-view="cards"><thead><tr><th></th><th data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>Use step-by-step instructions to upload</strong></td><td><a href="/pages/KdQbFqngkrpv4hQZVUzW">/pages/KdQbFqngkrpv4hQZVUzW</a></td></tr><tr><td><strong>Learn how blocks are used in Game Maker</strong></td><td><a href="/pages/ols17GPkgyz6FITfVvSZ">/pages/ols17GPkgyz6FITfVvSZ</a></td></tr><tr><td><strong>Install Game Maker to Test Your Creations</strong></td><td><a href="/pages/KF1fiE8DCtfTMPYrTRVW">/pages/KF1fiE8DCtfTMPYrTRVW</a></td></tr></tbody></table>

{% hint style="warning" %}
Blocks are not moved by gravity or physics in Game Maker.
{% endhint %}

{% hint style="warning" %}
Blocks can not be minted and sold on the Marketplace.
{% endhint %}
{% endtab %}
{% endtabs %}

## Getting Started

{% tabs %}
{% tab title="Open the Block Editor" %}

### Open the Block Editor

In VoxEdit's **Home** screen, select the **Block** editor in the left menu. Then:

<table data-column-title-hidden data-view="cards"><thead><tr><th></th></tr></thead><tbody><tr><td><img src="/files/hAqjqdGayUL8KKDaVpSj" alt="" data-size="line"> Create a new block</td></tr><tr><td><img src="/files/PPAbZv4fuiXfMQM77zo9" alt="" data-size="line"> Open a previous block file</td></tr><tr><td>Open a recent file (click on a thumbnail)<br></td></tr></tbody></table>

<figure><img src="/files/7uWnNfSz3LitLTE2HhGN" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Block Editor Window Tips" %}

### Block Editor Window

<table data-view="cards"><thead><tr><th></th><th></th></tr></thead><tbody><tr><td><strong>Tool Tips</strong></td><td><span data-gb-custom-inline data-tag="emoji" data-code="2199">↙️</span> Hover your mouse over anything in VoxEdit for tool tips at the bottom left.</td></tr><tr><td><strong>Performance Data</strong></td><td><span data-gb-custom-inline data-tag="emoji" data-code="2198">↘️</span> See performance data at the bottom right (moved from the Viewport).<br><img src="/files/q7RMUgDeAOIoXhIPF3P2" alt=""></td></tr><tr><td><strong>Dropdown Menu</strong></td><td><span data-gb-custom-inline data-tag="emoji" data-code="2b06">⬆️</span> See <a data-mention href="/pages/cXUcGr3QQ0n99cBJKFJt">/pages/cXUcGr3QQ0n99cBJKFJt</a> for <a data-mention href="/pages/cXUcGr3QQ0n99cBJKFJt#dropdown-menu">/pages/cXUcGr3QQ0n99cBJKFJt#dropdown-menu</a> details.</td></tr></tbody></table>

<figure><img src="/files/Z3XbxX8rHhDirP9gg1YA" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Viewport: Your Project Space" %}

### Viewport

The **Viewport** is the central area of the screen where you can view and work on your project.

See [Controls & Shortcuts](/en/creator/voxedit/docs/controls-and-shortcuts.md#viewport-controls) to learn how to:

* Take a screenshot
* Position your project
* Adjust camera sensitivity
* Change lighting and background colour

{% hint style="info" %}
The front of your project is indicated by a large white arrow outside of the block (oriented to the positive <mark style="color:blue;">**Z**</mark> axis). Note the colour coded axes on the [Controls & Shortcuts](/en/creator/voxedit/docs/controls-and-shortcuts.md#gizmo-1).
{% endhint %}

<figure><img src="/files/Ibwrj8U8OW3PL8bh6q2g" alt="" width="563"><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

***

## Panels

{% hint style="info" %}
Learn how the Block editor's panels work below. See [Panels & Custom Layouts](/en/creator/voxedit/docs/panels-and-custom-layouts.md) to personalise VoxEdit.
{% endhint %}

### Menubar

{% tabs %}
{% tab title="About" %}
The **Menubar** helps you save, translate, and visualize your project.

<figure><img src="/files/o3nomOoWLjpH1K5FP9My" alt="" width="533"><figcaption><p>Default</p></figcaption></figure>
{% endtab %}

{% tab title="Controls" %}

#### **Controls**

<table data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-cover data-type="files"></th></tr></thead><tbody><tr><td><strong>Save</strong></td><td><img src="/files/4k4LMMpHdqkF4H7lgIJM" alt="" data-size="original"><kbd>CTRL</kbd>+<kbd>S</kbd></td><td>Commit to changes.<br><br><span data-gb-custom-inline data-tag="emoji" data-code="2139">ℹ️</span> Use <strong>File</strong> -> <strong>Save As</strong> to save another version of your project.</td><td></td></tr><tr><td><strong>Rotate</strong></td><td><img src="/files/cGL9JvphIj3iaMcwfus3" alt=""> <img src="/files/hPRUmYfVUuvIw434JaN2" alt=""> <img src="/files/AKhtHfTE1ibxRWKPEgvJ" alt=""></td><td>Turn the entire Block 90 degrees around the <mark style="color:red;"><strong>X</strong></mark>, <mark style="color:green;"><strong>Y</strong></mark>, or <mark style="color:blue;"><strong>Z</strong></mark> axis.</td><td></td></tr><tr><td><strong>Flip</strong></td><td><img src="/files/EhVsLOgM1vtvQma7dyEk" alt=""> <img src="/files/XNKdYpWY90D1xdclr4zq" alt=""> <img src="/files/I0oieTDy59hBbQiPpjxJ" alt=""></td><td>Flip the entire Block 180 degrees.</td><td></td></tr><tr><td><strong>Mirror</strong></td><td><img src="/files/3e5vaBVLDMhyGKy6HsNn" alt=""> <img src="/files/T3O6EmF9V3jPAH7UPj3Q" alt=""> <img src="/files/nHmYJK3pnA0ya1fekNMV" alt=""></td><td>Toggle on and off a line of symmetry on the <mark style="color:red;"><strong>X</strong></mark>, <mark style="color:green;"><strong>Y</strong></mark>, or <mark style="color:blue;"><strong>Z</strong></mark> axis for mirrored editing.</td><td></td></tr><tr><td><strong>Edges</strong></td><td><img src="/files/h3RSoa1UMXiqvaC3O1Ra" alt="">  <img src="/files/IKKCkVFmzFGKbTkx83OF" alt=""></td><td><p>Show or hide voxel edges. </p><p>Edges reveal a 32x32 grid on each Block face for measurement and precision work.</p></td><td></td></tr><tr><td><strong>Focus</strong></td><td><img src="/files/tPVUdWTMZb0zYMHkjVUK" alt="" data-size="original"> <kbd>F</kbd></td><td>Focus the camera to the default start position.</td><td></td></tr></tbody></table>
{% endtab %}
{% endtabs %}

### Toolbar

{% tabs %}
{% tab title="About" %}
The **Toolbar** allows you to choose how to paint on your block, with different shapes and depths.

{% hint style="info" %}
The **Block** editor is paint-only. The [Modeler](/en/creator/voxedit/docs/modeler.md) also includes **modes** to add, erase, and select voxels.
{% endhint %}

<figure><img src="/files/9Gx8y9tA4bGAUzAqz6xL" alt=""><figcaption><p>Resized</p></figcaption></figure>
{% endtab %}

{% tab title="Controls" %}

#### Controls

<table data-view="cards"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td><img src="/files/k6aldFanE6sGdUFfXiV4" alt=""> <strong>Pencil</strong></td><td><img src="/files/rI7knhixPWx7uqfr2V5a" alt=""></td><td>Click or drag to affect single voxels (free editing).</td></tr><tr><td><img src="/files/uNQF9iBkX3moQdY4b5S7" alt=""> <strong>Line</strong></td><td><img src="/files/m9hGmgrmfn3tcOUPSJky" alt=""></td><td>Click and drag to affect a straight line of voxels.</td></tr><tr><td><img src="/files/D2J8ZwxEshWDcdf7C0ZQ" alt=""> <strong>Rectangle</strong></td><td><img src="/files/LfMG010cv8exNhVE6LWU" alt=""></td><td>Click and drag to affect voxels in a rectangle from the screen's perspective.</td></tr><tr><td><img src="/files/jjj7DpAXq7glBkBy3ngY" alt=""> <strong>Circle</strong></td><td><img src="/files/gKrxpH1Ek91Hv2CTc0Jo" alt=""></td><td>Click and drag to affect voxels in an ellipse from the screen's perspective.</td></tr><tr><td><img src="/files/BcjUIRyk2V8MJaq4Avo4" alt=""> <strong>Box</strong></td><td><img src="/files/QkT8LKpjZmYjZMc64R14" alt=""></td><td>Click and drag to affect voxels within a box shape.</td></tr><tr><td><img src="/files/W0uKGDjt5OGi5vQPh7UD" alt=""> <strong>Bucket</strong></td><td><img src="/files/DosXkXxBMdNFKl5D7ZhT" alt=""></td><td>Click to affect all voxels of the same colour that touch.</td></tr><tr><td><img src="/files/uvFUT516hwxcm3SEdDVR" alt=""> <strong>Picker</strong></td><td><img src="/files/KhXcjkNEXawGf00lEGF0" alt=""></td><td>Select a colour used on your block in the viewport (updates the Materials and Palette panels).</td></tr></tbody></table>
{% endtab %}
{% endtabs %}

### Palette

{% tabs %}
{% tab title="About" %}
The **Palette** panel holds colours for your project in up to 255 swatches, or locations. This data is stored in small .PNG files. Palettes are easy to customise.

<figure><img src="/files/4ZbepX7RJtCcHZxV1FFe" alt="" width="236"><figcaption><p>A <kbd>white square</kbd> highlights <br>the selected swatch.<br>Resized</p></figcaption></figure>
{% endtab %}

{% tab title="Controls" %}

#### Controls

<table data-view="cards"><thead><tr><th></th><th></th></tr></thead><tbody><tr><td><strong>Select a Swatch</strong></td><td>Left click on a swatch</td></tr><tr><td><strong>Change Swatch Size</strong></td><td><img src="/files/rvhqgixidrhzFbcbJeJf" alt="" data-size="line"> Toggle between small, medium, and large</td></tr><tr><td><strong>Save, Load, or New Palette</strong></td><td><img src="/files/gjOOQB00oU3vFyWf9a4u" alt="" data-size="line"> Open the menu</td></tr></tbody></table>
{% endtab %}

{% tab title="Changing Colours" %}

#### Changing Colours

VoxEdit applies colour based on data in a swatch location.&#x20;

{% hint style="warning" %}
If you used a swatch to paint a block, any changes to that swatch's colour will apply to the block:

* Changing a swatch's colour in the Materials panel
* Loading a palette with a different color in the same swatch location
  {% endhint %}

Create a new colour with the **Materials** panel or customise the **Palette** using existing colours.

#### Position & Blending

<figure><img src="/files/DLXgf9zCfYsjWANRf8qN" alt="" width="525"><figcaption><p>2024 Palette Updates</p></figcaption></figure>

<table data-view="cards"><thead><tr><th></th><th></th></tr></thead><tbody><tr><td><strong>Cut, Copy &#x26; Paste</strong></td><td>Select or right click to cut, copy &#x26; paste swatch colours into other swatch locations.</td></tr><tr><td><strong>Move (Drag &#x26; Drop)</strong></td><td>Click and hold, drag, and drop to another location</td></tr><tr><td><strong>Blend</strong></td><td>Space colours apart as desired, select and drag from one colour to the other, right click, select <strong>Blend</strong> in the menu.</td></tr></tbody></table>
{% endtab %}
{% endtabs %}

### Materials

{% tabs %}
{% tab title="About" %}
The **Materials** panel is used to change the colour of the swatch that is selected in the **Palette**.

{% hint style="warning" %}
Changing a swatch's colour will change the colour on your creation anywhere it has been used.
{% endhint %}

<figure><img src="/files/meaCFPSDpKr6UgcCpi8B" alt=""><figcaption><p>A <kbd>white rectangle</kbd> highlights <br>the selected swatch colour.<br>Default</p></figcaption></figure>
{% endtab %}

{% tab title="Controls" %}

#### Manual Colour Change

<table data-view="cards"><thead><tr><th></th></tr></thead><tbody><tr><td><strong>Slide</strong> <img src="/files/QomX9zQc2QyRkrMdMAnD" alt="" data-size="line"><br><br><img src="/files/ZYksLSdkQFjZIFmZvNgi" alt="" data-size="original">   <span data-gb-custom-inline data-tag="emoji" data-code="2195">↕️</span> <mark style="color:yellow;"><strong>Hue</strong></mark></td></tr><tr><td><strong>Drag</strong> <img src="/files/Rzaa0YEeR5Vhu7wXgIsd" alt="" data-size="line"> <br><br><img src="/files/vjFCvQBlDT5AM6O8BVs6" alt="">   <span data-gb-custom-inline data-tag="emoji" data-code="2195">↕️</span> <mark style="color:yellow;"><strong>Tint</strong></mark><br> <br><span data-gb-custom-inline data-tag="emoji" data-code="2194">↔️</span> <mark style="color:yellow;"><strong>Saturation</strong></mark><br></td></tr><tr><td><strong>Toggle button</strong><br><br><img src="/files/Vrcr19pBupG4cCPdprzj" alt="" data-size="original"> <mark style="color:yellow;"><strong>Emissive Colour</strong></mark><br><br><span data-gb-custom-inline data-tag="emoji" data-code="2139">ℹ️</span> This icon appears in the preview box and on the colour swatch if emissive is applied.</td></tr></tbody></table>

{% hint style="info" %}
Emissive colours have a soft glow, but don't affect nearby assets in a game (builders use [Light](/en/creator/game-maker/docs/components/display/light.md)).
{% endhint %}

{% hint style="success" %}
Emissive colours are often used for lighted buttons on panels, fire, and other luminous details.
{% endhint %}

#### Colour Match

* **Set Colour (code):** Type RGB, HSB, or HEX codes and press <kbd>**ENTER**</kbd>.
* **Colour Sample (screen):** Click <img src="/files/ege5WDtVwckwde7uRqnZ" alt="" data-size="line"> and hold, hover over a color, and release.

{% hint style="warning" %}
Colours may differ slightly between VoxEdit, the Marketplace, Game Maker, and the Game Client.
{% endhint %}
{% endtab %}
{% endtabs %}

### Block Sides

{% hint style="info" %}
In the **Viewport**, the front of a block is indicated by a white arrow on the floor.
{% endhint %}

{% tabs %}
{% tab title="About" %}
The **Block Sides** panel treats each side of your block like a 2D image. Select a block side and use controls to modify.

<figure><img src="/files/7wzSObsJi1QUM0GDIraQ" alt="" width="224"><figcaption><p>Default</p></figcaption></figure>
{% endtab %}

{% tab title="Controls" %}
{% hint style="warning" %}
Changing a side's edges will change other sides that share the edge.
{% endhint %}

#### **Controls**

<table data-view="cards"><thead><tr><th></th></tr></thead><tbody><tr><td><img src="/files/5D00PS5XpUdK4FfxMjah" alt="" data-size="original"><strong>Flip left to right</strong><br><img src="/files/9mPtpnPt6NGo74S93UYb" alt=""><strong>Flip top to bottom</strong></td></tr><tr><td><img src="/files/RBpod8n0aaqRWJC2Gl1n" alt="" data-size="original"><strong>Rotate right</strong><br><img src="/files/7XPmSvIjAygnC1N12I7G" alt=""><strong>Rotate left</strong></td></tr><tr><td><img src="/files/yJtUVyaWtrpP9RZ9FrTs" alt="" data-size="original"><strong>Export image</strong><br><img src="/files/uUKzNnf3eUphZs3Xvm9S" alt=""><strong>Import image</strong></td></tr></tbody></table>

{% endtab %}

{% tab title="Creative Uses" %}
{% hint style="success" %}
**REUSE SIDES**&#x20;

**Drag and drop** any side onto another to duplicate it.
{% endhint %}

{% hint style="success" %}
**IMPORT USES**

Import a .PNG image to a side as a reference to re-paint or to generate a colour palette for your project.
{% endhint %}

{% hint style="success" %}
**CREATE MULTIPLE SIMILAR BLOCKS**

Create a set of blocks for grasses, streets, walls, etc. with variation by exporting each side and importing into a new project to modify or use **File** -> **Save As** to create a new version of your project.
{% endhint %}
{% endtab %}
{% endtabs %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.sandbox.game/en/creator/voxedit/docs/block.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
