This is a free online tool that allows you to obfuscate CSS code.
How to use Online CSS Obfuscator:
- Enter your CSS code in the input box below.
- Click Obfuscate. Online CSS Obfuscator will convert the CSS code to obfuscated JavaScript code.
If your CSS contains relative paths (as shown in the examples below), the output JavaScript code will also include the same relative paths.
font-family: "MyFont";
src: url("fonts/my-font.ttf");
}
width: 300px;
height: 200px;
background: url("../img/bg.png");
}
background-image: url('bg/body.jpg');
background-size: 200vh;
background-repeat: repeat-y;
}
width: 50%;
background-color: rgb(23,129,202);
border-image: url('images/star.png');
}
Make sure you place the JavaScript file on your website in such a way that the relative paths are maintained. If you break relative paths, you may encounter missing images, fonts, and other web resources defined in your CSS file.
The easiest way to decide where to put the output JavaScript file is to place it in the same folder as your input CSS file is located.
For example, if the path of the CSS file is mysite/css/style.css, then place the output JavaScript file in mysite/css/. Putting it in the same folder guarantees that all the relative paths in your CSS file are maintained.