# Using the advanced UI function setStyle to add CSS

**URL:** <https://forum.code.org/t/using-the-advanced-ui-function-setstyle-to-add-css/40601>\
**Category:** CS Principles\
**Tags:** csp-unit-5\
**Created:** [March 25, 2025, 3:10pm UTC](https://forum.code.org/t/using-the-advanced-ui-function-setstyle-to-add-css/40601 "2025-03-25T15:10:39Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![grace.mcmanus](https://avatars.discourse-cdn.com/v4/letter/g/7bcc69/32.png) [@grace.mcmanus](https://forum.code.org/u/grace.mcmanus)\
**Post date:** [March 25, 2025, 3:10pm UTC](https://forum.code.org/t/using-the-advanced-ui-function-setstyle-to-add-css/40601/1 "2025-03-25T15:10:39Z")

</div>

Hello,

I would like to write code that can change the color of a simple clipart file. That is, I don’t want to be limited to the icons available. I thought I could use the setStyle function - but I can’t figure it out.

Any help would be greatly appreciated!

Thanks.

---

<div class="post-metadata">

**Author:** ![sgaraas](https://avatars.discourse-cdn.com/v4/letter/s/97f17d/32.png) [@sgaraas](https://forum.code.org/u/sgaraas)\
**Post date:** [March 26, 2025, 2:20pm UTC](https://forum.code.org/t/using-the-advanced-ui-function-setstyle-to-add-css/40601/2 "2025-03-26T14:20:10Z")

</div>

To change the color of clipart you will need to have a transparent background image. Then, you can do something like the following with setStyle()

setStyle(“image1”, “filter: invert(19%) sepia(92%) saturate(7063%) hue-rotate(358deg) brightness(94%) contrast(110%);”);

You can use this site to figure out the values for filter based on the color you want: [https://isotropic.co/tool/hex-color-to-css-filter/](https://isotropic.co/tool/hex-color-to-css-filter/)

---

<div class="post-metadata">

**Author:** ![grace.mcmanus](https://avatars.discourse-cdn.com/v4/letter/g/7bcc69/32.png) [@grace.mcmanus](https://forum.code.org/u/grace.mcmanus)\
**Post date:** [March 27, 2025, 2:49pm UTC](https://forum.code.org/t/using-the-advanced-ui-function-setstyle-to-add-css/40601/3 "2025-03-27T14:49:45Z")

</div>

Thank you so much for your help. At first I could not get the call to setStyle to work - but when I changed the double quotes to single - it worked.

The website is also very helpful!

I have made an app that allows the user to select a shape and use it as a stamp on the canvas. I will now add a drop down to select color and will also move the canvas to a different screen.

> **[Check out what I made](https://studio.code.org/projects/applab/BsEQYNAi-qC8APpy0WhfCc8rXvvldF7n93I3BH8Yxuc)**
>
> I wrote the code myself with Code.org

Thanks again!
