> 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/colour-and-outline/colormode.md).

# colorMode()

Example

#### RGB Mode (Red, Green, Blue)

<figure><img src="/files/1haixXRghAbXh4o2m9hT" alt=""><figcaption></figcaption></figure>

#### HSB Mode (Hue, Saturation, Brightness)

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

### Syntax

```
colorMode(mode, [max])
```

or

```
colorMode(mode, max1, max2, max3, [maxA])
```

<table><thead><tr><th width="249">Input</th><th>Description</th></tr></thead><tbody><tr><td>mode</td><td><strong>RGB</strong>(Red/Green/Blue) or <strong>HSB</strong>(Hue/Saturation/Brightness)</td></tr><tr><td>max(optional)</td><td>maximum value for each color component</td></tr><tr><td>max1</td><td>maximum value for red/hue component</td></tr><tr><td>max2</td><td>maximum value for green/saturation component</td></tr><tr><td>max3</td><td>maximum value for blue/brightness component</td></tr><tr><td>maxA(optional)</td><td>maximum value for alpha component</td></tr></tbody></table>

### Full Example

<details>

<summary>Example Full Code - RGB Mode</summary>

```python
#RGB Mode

def setup():
  createCanvas(400,400)
  colorMode(RGB)
  global slider1,slider2,slider3
  slider1 = createSlider(0, 255,1)
  slider1.position(50,40)
  slider2 = createSlider(0,255,1)
  slider2.position(50,60)
  slider3 = createSlider(0,255,1)
  slider3.position(50,80)
  
def draw():
  global slider1,slider2,slider3
  background("grey")
  textSize(15)
  stroke('black')
  fill(0)
  text("Red",200,25)
  text("Green",200,45)
  text("Blue",200,65)
  fill(slider1.value(),slider2.value(),slider3.value())
  triangle(100,100,200,300,300,100)
```

</details>

<details>

<summary>Example Full Code - HSB Mode</summary>

```
#HSB Mode

def setup():
  createCanvas(400,400)

  colorMode(HSB)
  global slider1,slider2,slider3
  slider1 = createSlider(0, 360,1)
  slider1.position(50,height - 40)
  slider2 = createSlider(0,100,1)
  slider2.position(50,height - 60)
  slider3 = createSlider(0,100,1)
  slider3.position(50,height - 80)

  noStroke()
  

def draw():
  translate(width/2,height/2)
  global slider1,slider2,slider3

  h = slider1.value()
  s = slider2.value()
  b = slider3.value()

  background(h,s,b)

  push()
  textSize(15)
  stroke(0, 0, 100-b)
  fill(0, 0, 100-b)
  
  text("Hue",0,-175)
  text("Saturation",0,-155)
  text("Brightness",0,-135)
  pop()
  
  for r in range(100, -10,-10):
    for theta in range(0,360,2):
      fill(theta,100*(r/100),100)
      size = 10
      circle(r*cos(theta),r*sin(theta),size)

  push()
  fill(h,100*(s/100),100)
  stroke('grey')
  circle(s*cos(h),s*sin(h),50)
  pop()
```

</details>

### Description

The `colorMode()` function is used to **set the range and mode for color** values in a sketch. It determines how colors are represented and displayed in the canvas.

When the color mode is set to **RGB**, the **maximum values** for red, green, and blue are typically **255**, which represents the maximum intensity of each color channel. When the color mode is set to **HSB**, the maximum values for hue, saturation, and brightness are typically **360, 100, and 100** respectively.

By default, the color mode is set to RGB with a maximum value of 255 for each color channel.

{% 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 %}