# Coloring a instanced cylinders vertex wise

**URL:** <https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995>\
**Category:** Questions\
**Created:** [December 29, 2020, 10:35am UTC](https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995 "2020-12-29T10:35:37Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Browork](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/browork/32/13350_2.png) [@Browork](https://forum.babylonjs.com/u/Browork)\
**Post date:** [December 29, 2020, 10:35am UTC](https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995/1 "2020-12-29T10:35:37Z")

</div>

I have following scene with instaced cylinder with edge rendering:

> **[Babylon.js Playground](https://www.babylonjs-playground.com/#YPABS1%2392)**

Now I want to color the cylinders “vertex-wise” for example the top and bottom of the cylinder should be black and lateral surface green.

Is there a performant way to do this?  
Side question: Is it possible to do the same with thin instanced? I would also like to implement picking in the next step.

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [December 29, 2020, 11:05am UTC](https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995/2 "2020-12-29T11:05:04Z")

</div>

As long as all instances have the same top, down and side you could either use a texture or vertex colors.

If not, you might need custom attributes for the three values and a custom shader.

And if it needs more per vertex specific infos, instances won t be a good fit

---

<div class="post-metadata">

**Author:** ![Browork](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/browork/32/13350_2.png) [@Browork](https://forum.babylonjs.com/u/Browork)\
**Post date:** [December 29, 2020, 1:33pm UTC](https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995/3 "2020-12-29T13:33:38Z")

</div>

The cylinders have all the same “color distribution” and only when selected I want to change the vertex colors of one specific cylinder. In other engines I can do this with bufferattributes likes “colors” instead of “color” but it seems like it works differenttly

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [December 29, 2020, 3:41pm UTC](https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995/4 "2020-12-29T15:41:47Z")

</div>

vertex colors is simple and supported in babylon, but you can not change it per instance, like you can not change the position buffer per instance. in this case you could probably use a custom shader like from NME where you mix the colors based on an attib value so the selected one could have a different color set than the others and only the gradient info is stored in the attributes.

---

<div class="post-metadata">

**Author:** ![Browork](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/browork/32/13350_2.png) [@Browork](https://forum.babylonjs.com/u/Browork)\
**Post date:** [December 30, 2020, 9:48am UTC](https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995/5 "2020-12-30T09:48:48Z")

</div>

In my example I change the position per instance or not?

```
  ` instance.position.x = 20 - Math.random() * 40;
    instance.position.y = 20 - Math.random() * 40;
    instance.position.z = 20 - Math.random() * 40;`

```

To the vertex colors: If I understand correctly I can’t give a vertex of an instance a specific color without using a shader directly?

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [December 30, 2020, 1:25pm UTC](https://forum.babylonjs.com/t/coloring-a-instanced-cylinders-vertex-wise/16995/6 "2020-12-30T13:25:58Z")

</div>

@sebavan was speaking about the position buffer, meaning the position of each of the vertex individually: you can change the global position for each instance but not their vertex coordinates. Same thing for the vertex color buffer: you can have a different global color for each different instance but not a different color for each vertex for each instance.

> [@Browork](#):
>
> If I understand correctly I can’t give a vertex of an instance a specific color without using a shader directly?

That’s it.
