> For the complete documentation index, see [llms.txt](https://learnpython.strivemath.com/p5-python-web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://learnpython.strivemath.com/p5-python-web/reference/built-in-functions/creategraphics.md).

# createGraphics()

### Example

![](/files/5pf43CdjGYmJkrviSbPC)

```python
def setup():
  ...
  global canvas2
  canvas2 = createGraphics(200, 200)
  
def draw():
  ...
  
  canvas2.background(112, 88, 255)
  canvas2.fill(176, 235, 51)
  canvas2.circle(100,100,100)
  
  image(canvas2, 100, 100)
```

### Syntax

```python
createGraphics(w, h)
```

<figure><img src="/files/eA2SIdRBdcaTq2WPu2aL" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="227">Inputs</th><th>Description</th></tr></thead><tbody><tr><td>w</td><td>width of the off-screen buffer</td></tr><tr><td>h</td><td>height of the off-screen buffer</td></tr><tr><td></td><td></td></tr></tbody></table>

### Description

the `createGraphics()` function is used to **create an off-screen graphics** buffer that can be manipulated and then displayed on the main canvas.

The buffer is displayed on the main canvas using `image(buffer, x, y)`.

Using `createGraphics()` allows you to create complex graphics that can be drawn off-screen before being displayed on the main canvas. This is particularly useful when you want to create more complex animations or drawings that would be difficult to create directly on the main canvas.

#### Example:&#x20;

*Below program uses one background under setup() and one under draw()*

<figure><img src="/files/LtR0REsEeRXoCg32r6so" alt=""><figcaption></figcaption></figure>

<details>

<summary>Example full code</summary>

```python
def setup():
  createCanvas(400,400)
  frameRate(7)
  global buffer
  buffer = createGraphics(200, 200)
  background(255, 79, 132)
  
def draw():
  noStroke()
  fill(255, 164, 28,100)
  circle(random(width),random(height),50)
  # drawTickAxes()
  buffer.background(112, 88, 255)
  buffer.noStroke()
  # buffer.drawTickAxes()
  buffer.fill(176, 235, 51)
  buffer.circle(random(20,190),random(20,190),50)
  image(buffer, 100, 100)
```

</details>

{% hint style="info" %}
Find these documents helpful? Let the people who made them help your child learn to code at [**Strivemath**](https://www.strivemath.com/)<mark style="color:blue;">**!**</mark>

We'd love to hear your Feedback/Comments [here](https://docs.google.com/forms/d/e/1FAIpQLSeqorBAGTya-YBRI-VFjJxtgQtCz3ucGDI96K96sNyuaGuvdw/viewform?usp=sf_link).
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://learnpython.strivemath.com/p5-python-web/reference/built-in-functions/creategraphics.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
