# One step closer to having themes on KIRUPA

**URL:** <https://forum.kirupa.com/t/one-step-closer-to-having-themes-on-kirupa/641532>\
**Category:** random\
**Created:** [January 8, 2020, 5:11am UTC](https://forum.kirupa.com/t/one-step-closer-to-having-themes-on-kirupa/641532 "2020-01-08T05:11:38Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [January 8, 2020, 5:11am UTC](https://forum.kirupa.com/t/one-step-closer-to-having-themes-on-kirupa/641532/1 "2020-01-08T05:11:38Z")

</div>

What the top of the CSS looks like currently:

```
:root {
	--primary: #0798ff;
	--primaryDarker: #0267af;
	--primaryLighter: #aadcff;
	--primaryLightest: #EAF7FF;
	--light: #f3f3f3;
	--inputBackground: #FFF;
	--inputBorder: #aadcff;
	--headingText: #222222;
	--bodyText: #373d42;
	--serifFonts: "Helvetica Neue", Helvetica, Arial, sans-serif;
	--monoFonts: "SF Mono", Menlo, monospace, "SF Pro Icons";
	--pageBackground: #FFFFFF;
	
	--linkForeground: #0599ff;
	--linkBackground: hsla(209, 100%, 52%, 0.07);
	--linkHoverForeground: hsla(50, 100%, 25%, 1);
	--linkHoverBackground: hsla(50, 100%, 50%, 0.51)
}

```

The header is no longer a static image but a dynamically generated canvas one where the color values are read from the above CSS. There are a few more areas where I’ll need to figure out whether to generalize some hard-coded values away into a re-usable custom property. There are also a handful of SVGs that I will need to inline to ensure they can have color values that read from the custom properties as well.

🥞

---

<div class="post-metadata">

**Author:** ![TheCanadian](https://avatars.discourse-cdn.com/v4/letter/t/67e7ee/32.png) [@TheCanadian](https://forum.kirupa.com/u/TheCanadian)\
**Post date:** [January 8, 2020, 1:46pm UTC](https://forum.kirupa.com/t/one-step-closer-to-having-themes-on-kirupa/641532/2 "2020-01-08T13:46:31Z")

</div>

Cool! Does this mean we can see a Canadian coloured orange?

Wasn’t there a Canadian theme on the old forums, or am I still in an early morning haze?

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [January 8, 2020, 5:29pm UTC](https://forum.kirupa.com/t/one-step-closer-to-having-themes-on-kirupa/641532/3 "2020-01-08T17:29:05Z")

</div>

There was! And yes, the orange and KIRUPA text will be theme-able as well. It’s going to be a hoot.

---

<div class="post-metadata">

**Author:** ![prg9](https://avatars.discourse-cdn.com/v4/letter/p/8dc957/32.png) [@prg9](https://forum.kirupa.com/u/prg9)\
**Post date:** [January 9, 2020, 5:14pm UTC](https://forum.kirupa.com/t/one-step-closer-to-having-themes-on-kirupa/641532/4 "2020-01-09T17:14:23Z")

</div>

I hope there are enough custom properties to enable a [https://www.lingscars.com/](https://www.lingscars.com/) style theme here. 😜 :thumb2:

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [May 9, 2020, 7:09am UTC](https://forum.kirupa.com/t/one-step-closer-to-having-themes-on-kirupa/641532/5 "2020-05-09T07:09:33Z")

</div>

Now, we are even more close than we were earlier this year. The one wrinkle was the header. I changed its implementation to display the randomly sized and positioned circles by tweaking CSS radial gradients which, in turn, rely on CSS custom properties 🕶