Changing my color values to HSL Values or Element Parameters

[PelanPelan]

Hello, hope your day is good.

I saw at one point there was a feature request to add HSL values on a post in 2021. Did this ever get implemented? Really this is pretty much a standard practice for good color management now. With as advanced as Pro and Cornerstone is, I am hoping it is implemented now.

Control over my hue, saturation and lightness values is a very important color management system I use when building sites. I tried adding it to the picker but it converts it to RGBA. Going back and forth from a picker to Cornerstone is not an effective workflow.

It looked like I might be able to add an override using Element Parameters and this thrilled me. I did this to change my root font to 62.5% instead of using em values for fonts because I couldn’t find any other way to change the root font to % unless I use CSS. I am building a new BluePrint using pro and want my root font to be 62.5% and then have my base font set to 1 rem. Using px isn’t going to ever be an option I choose. I think it’s working as I hoped.

Now I am trying to put in the color parameters values for HSL but it still seems to be converting it to RGBA. These just aren’t the same. If I have to, I’ll use CodeBox to override this but it would be nice if I can just turn this into a parameter and save it into my blueprint this way.

I would be even willing to set up my default vars this way for the Blueprint.Am I missing something or is there a certain format to call up HSL values and I am just missing the snippet in the docs to accomplish this.

It is important to me and my team that we take a DRY development, BEM and VARs approach. Any help would be appreciated even if it was directing me to the right area in the docs to pull it off if I somehow am missing it.

Thanks in advance
A longtime user since before Protheme and I own the lifetime PRO Theme license.

[ruenel]

Hello @PelanPelan,

Thanks for writing in! Are you referring to this old thread:

• Feature Request Colours HSL - Support - Themeco Forum

Unfortunately, the feature request has not been implemented. We ask our Developers how we can prevent HSL values from getting converted to RGBA values. In the meantime, using the element’s custom Inline CSS may help.

Best Regards.

[PelanPelan]

Yes, I was referring to that link, in regards to the HSL. Thank you.

I really hope your development team implements HSL soon. Your Builder has passed so many best practice requirements. It is extremely flexible. From what I can tell, it looks like I could customize an entire white label dashboard using your API. Not to mention how easy it is to use any API. I am honestly still impressed after all of these years, but not having an option for HSL in 2024 is a shame. RGBA is an archaic practice and doesn’t allow for an exact match.

All that power and no HSL is just confusing to me.

As for the Global Variables, I have found several ways to go about it including tapping into your global parameters dynamic features . I have it working so I can set the font base to 62.5%. It shows up in the Dev tools, too. However, I am still not having much luck using the clamp() function during testing.

The easier approach seems to be: appling the font base and even the clamp() directly in using breakout mode. (This is just for testing purposes only).

Again, it is affecting my headings,and even allowing for complete fluid scaling but all of my heading are the same size. That’s the issue but also because there seems to be a lot of base level font properties I need to apply the clamp function to which is a no no.

I am going to try applying my var tokens in the global CSS inline and tokenize my headings to the clamp function, there. I see no reason why it wouldn’t work. If it does, that should be just fine. Although if it dirties up the code or if I have cascade priority issues. I’ll just have to move to WP CodeBox. I’ll update you either way with the direction I end up going with just to help future users with these alternative solutions.

Please let the devs know it really would be great if we had the ability to use HSL. It’s the one thing I can say that Bricks and ACCS have over this PRO-THEME and CS builder. It’s a lot easier to tap into the var, DRY, HSL, and BEM approach.

Your builder has the ability to allow me to probably accomplish building these features right into the options panel. That’s powerful and really cool but no offense. I don’t have the time nor want to customize it into every project or into the different blueprints. I guess that is what I do like about breakout mode. It seems to be the step we can take for a simple override.

Kind Regards
LB

[marc_a]

Hey @PelanPelan,

Thanks for your input, our development team is already looking into it. Please bear with us.

Thank you.