# Dynamically update alpha in color()

**URL:** <https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339>\
**Category:** Coding Questions\
**Created:** [November 8, 2018, 3:08am UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339 "2018-11-08T03:08:29Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![slow\_izzm](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/slow_izzm/32/5637_2.png) [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Post date:** [November 8, 2018, 3:08am UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339/1 "2018-11-08T03:08:29Z")

</div>

So, what if I wanted to dynamically change each individual rgba argument of color(), can I say this.col.r = 200; , or some equivalent?

```auto
let btn;

function setup() {
	createCanvas(400, 400);
	btn = new Btn(color(50, 127, 219, 255));
}

function draw() {
	clear();
	btn.run();
}

class Btn {
	constructor(_col) {
		this.col = _col;
		this.pos = createVector(width >> 1, height >> 1);
		this.r = 33;
	}

	display() {
		if (this.hover()) {
			fill(this.col, this.col.a); // this is ignoring alpha
			if (this.col.a < 255) {
				this.col.a += 0.3;
			}
		} else {
			noFill();
			strokeWeight(3);
			stroke(this.col);
			this.col.a = 0;
		}
		ellipse(this.pos.x, this.pos.y, this.r);
		return this;
	}

	hover() {
		let d = dist(mouseX, mouseY, this.pos.x, this.pos.y);
		if (d <= this.r >> 1) {
			return true;
		} else {
			return false;
		}
	}

	run() {
		return this.display().hover();
	}
}

```

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [November 8, 2018, 4:00am UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339/2 "2018-11-08T04:00:55Z")

</div>

A [p5.Color](https://p5js.org/reference/#/p5.Color) obj got some undocumented array properties which it uses to store colors in diff. standards. 🖌

For RGBa, I believe it’s stored in the [p5.Color](https://p5js.org/reference/#/p5.Color)::_levels[]_ property. 🏴‍☠️

---

<div class="post-metadata">

**Author:** ![slow\_izzm](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/slow_izzm/32/5637_2.png) [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Post date:** [November 8, 2018, 4:14am UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339/3 "2018-11-08T04:14:54Z")

</div>

So I see I can set the alpha via setAlpha(), how would you get/check the current alpha?

```auto
...

this.a = 255;

if (this.col.alpha > 255) { // <---?
 this.col.setAlpha(this.a +=13); // this.a is just bc i don't know how to get the alpha in order to update the value
}

```

live version to play with …

> **[state-change - OpenProcessing](https://www.openprocessing.org/sketch/623884)**
>
> trying to figure out color() get/set alpha

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [November 8, 2018, 5:43am UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339/4 "2018-11-08T05:43:30Z")

</div>

> [@slow\_izzm](#):
>
> … how would you get/check the current alpha?

I’ve already told you about [p5.Color](https://p5js.org/reference/#/p5.Color)::_levels[]_ for RGBa. 🖌

For more undocumented properties, go to: 🏃‍♂️

> <https://github.com/processing/p5.js/blob/main/src/color/p5.Color.js>

You can even find “secret” methods like [p5.Color](https://p5js.org/reference/#/p5.Color)::**\_getAlpha()** there: ㊙

> <https://github.com/processing/p5.js/blob/0.7.2/src/color/p5.Color.js#L376-L378>

---

<div class="post-metadata">

**Author:** ![slow\_izzm](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/slow_izzm/32/5637_2.png) [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Post date:** [November 8, 2018, 2:04pm UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339/5 "2018-11-08T14:04:27Z")

</div>

thanks @GoToLoop, i will dig into this and try to figure it out. i appreciate the help.

---

<div class="post-metadata">

**Author:** ![slow\_izzm](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/slow_izzm/32/5637_2.png) [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Post date:** [November 9, 2018, 2:16am UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339/6 "2018-11-09T02:16:35Z")

</div>

figured it out, thanks again … pointing me to that doc was very helpful.