Avoiding cross-site scripting vulnerabilities in style with htmlSafe()

Hej I am new(ish) to ember.js and am trying to build a helper function that processes string input from an ACF input field on wordpress. The attempt is to avoid getting a warning message from the browser about XSS attacks. Simply: the goal is to be able to create colors and gradient re-designs through the clients cms. However; even tho the string runs through the helper easily, and produces the desired effect of a new, supposedly safe, html string. I still get the warning.

code snippets are here: from the helper in app/helpers

import {helper} from '@ember/component/helper'
import Ember from 'ember';
import { htmlSafe } from '@ember/string'
const htmlEscape = Ember.Handlebars.Utils.escapeExpression;

export function escapeCSS(string) {
    let safestring = htmlEscape(string);    
    return htmlSafe(safestring);
}

export default helper(escapeCSS)

from the template

<div style="background-image:linear-gradient(, )" class="/homepage"></div>