[βœ… Solution] How can we apply the css tape color scheme?

Hi guys,

how can we implement the css tape color scheme in calculation field?

2 Likes

Hi @comfreakph,

thanks for sharing your question! :rocket:

If I understood you correctly, you would like to style some of your calculation field’s HTML according to Tape’s color palette?

Indeed, Tape exposes a set of CSS variables that you can use for exactly that use case. These variables are dynamic, and automatically adjust colors to Tape’s color scheme (even if changes were made in the future). You find more details here:

I hope that points you into the right direction?

Let me know how that goes!

Happy coding
Tim

Hi @Tim,
Thanks for the reply,
how can we apply it? like:
<span class='--tape-color-primary '>no email yet</span>

1 Like

@comfreakph Tape exposes standard CSS variables, you can either refer to them inside <style> tags, or you can directly use the HTML style property (note the var(--...) syntax.:

You find a small set of examples here:

Happy coding!
Cheers
Tim

@Tim, thanks, coz it was not in documentation on how to use it hehe…
many thanks again.

1 Like

You’re welcome! I will add an example to the docs to make using the CSS variables smoother and more accessible.

Thanks for bringing this up. :100:

Cheers
Tim

1 Like

Thanks @Tim,
Love the result
tape-email-log

2 Likes

So do I! Great Job :sunglasses: