# Useful CSS Stuff

**URL:** <https://forum.inductiveautomation.com/t/useful-css-stuff/95414>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [September 2, 2024, 1:58am UTC](https://forum.inductiveautomation.com/t/useful-css-stuff/95414 "2024-09-02T01:58:19Z")\
**Posts on this page:** 1\
**Showing post:** 13

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [October 14, 2024, 5:53am UTC](https://forum.inductiveautomation.com/t/useful-css-stuff/95414/13 "2024-10-14T05:53:59Z")

</div>

You can create new colours from existing colours, for example changing the alpha channel of existing colours, explicity setting any of the h, s, l / r, g, or b values, or applying calculations to them:

```python
hsl(from var(--your-css-variable) h s l / 80%) # set the alpha channel to 80%
hsl(from var(--your-css-variable) h 30% l) # set the saturation of the colour to 30%
rgb(from aliceblue r g calc(b + 50)) # sets the blue value of the aliceblue colour to the blue value + 50 

```

Edit: I realise now that this is an elaboration of this!

> [@pascal.fragnoud](#):
>
> and the `rgb(from {color})` syntax.

---

_[View the full topic](https://forum.inductiveautomation.com/t/useful-css-stuff/95414)._
