skip to Main Content

I am using CSP on my website to keeps things locked down as much as possible. I have an HTML editor on the website, and I wanted to allow users to choose text colors from a color picker. This involves adding style="color:#XXXXXX" to the affected elements, where XXXXXX is a 24-bit value from the color picker. I am temporarily using style-src 'self' 'unsafe-inline' on my test rig to allow inline styles to be used to define the colors. But this would open me up to CSS injection attacks if I did it on the live system.

Is there any way to reliably sanitise CSS to allow inline styles to be used safely in this situation, or is there another way to safeguard inline styles so that only the editor can define them (maybe using nonces, which I use to add JS event handlers to HTML elements)?

2

Answers


  1. Chosen as BEST ANSWER

    Another approach I've been referred to by a friend is to use the OWASP Java HTML Sanitizer, if like me your webapp uses Java servlets. It is open source, so could in principal be ported to other languages.


  2. If you’re already using JavaScript, don’t set the color with the style HTML attribute. Instead, set the color directly with JavaScript:

    document.getElementById('some-element').style.color = "#123456";
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search