HTML/CSS Obfuscation Compiling

Question

I have a question about obfuscate the final output of an HTML and CSS file. Lets stay I have this HTML code below with the corresponding class names declared in a separate CSSfile:

<div class="header">
  <div class="logo"></div>
  <div class="session-info"></div>
</div> 

<div class="bank-account-content">
  <div class="account-info"></div>
  <div class="account-info"></div>
  <div class="here-is-my-ss-number"></div>
</div>

Is there a way to take my HTML/CSS file and process it in a way that it will take original class names/ids in a HTML/CSS file and randomly generate new files to replace the existing class names/ids with meaningless class names/ids to obscure the final output? For example, The above output would be processed and result in the html shown below with a corresponding style sheet that has the abstracted class/id names defined.

<div class="1dcx4y">
  <div class="1354fs"></div>
  <div class="f3wecd"></div>
</div> 

<div class="retv5">
  <div class="dgee2f></div>
  <div class="fhg54h"></div>
  <div class="dgd426"></div>
</div>

try this: https://github.com/bitstrider/obscure

strider
– strider

2017-02-07 04:33:43 +00:00
Commented Feb 7, 2017 at 4:33 — strider
– strider, Commented Feb 7, 2017 at 4:33
try: zeroify.com

SED
– SED

2017-06-08 16:21:37 +00:00
Commented Jun 8, 2017 at 16:21 — SED
– SED, Commented Jun 8, 2017 at 16:21
why would you want to do this?

CodyBugstein
– CodyBugstein

2018-01-29 21:05:19 +00:00
Commented Jan 29, 2018 at 21:05 — CodyBugstein
– CodyBugstein, Commented Jan 29, 2018 at 21:05
npmjs.com/package/munch

Kiryl Plyashkevich
– Kiryl Plyashkevich

2018-04-02 14:38:31 +00:00
Commented Apr 2, 2018 at 14:38 — Kiryl Plyashkevich
– Kiryl Plyashkevich, Commented Apr 2, 2018 at 14:38

bleuthoot · Accepted Answer · 2019-05-02 14:36:45Z

12

Try http://www.cssobfuscator.com/:

What it does:
- It will take your CSS file, apply minification, encoding and encypting and finally injects this unreadable crap into tailored JS library (also obfuscated).
- The result you will get is this tailored (unique) library, containing obfuscated CSS. Just include it in the place of the original CSS.
What it does not:
- It will not speed up displaying of your web.
- It will not hide CSS rules in inspector (developer's tools) - but it don't mind, attacker will probably not copy all stuff by one rule.

Or ~~http://htmlmuncher.com/~~: (Dead link, Github repository)

HTML Muncher is a command line utility written in Python that rewrites classes and ids in CSS, HTML, and JavaScript files in order to save precious bytes and obfuscate your code.
How it Works
1. You pass in a list of CSS, HTML, and JavaScript files to be rewritten
2. The CSS and JavaScript files are scanned to find any class and id references
3. The classes and ids are mapped to new classes and ids with 1 or 2 letter names (a, b, c ... aa, ab, ac ...)
4. The files are rewritten with the new class and id names and saved to a new location on disk

edited May 2, 2019 at 14:36

bleuthoot

851 silver badge7 bronze badges

answered Aug 28, 2015 at 2:58

Esteban Herrera

2,2912 gold badges25 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Ry- Over a year ago

Your second link is the right one, I think. The first tool is not very useful (it’s easy to break, it requires JavaScript, it doesn’t allow @media, it wants to host it itself without HTTPS support…).

Deepak Kamat Over a year ago

Link is broken for HTMLMuncher - so find it here on Github: github.com/ccampbell/html-muncher

Extrange planet Over a year ago

It removes the unused css? Thanks.

Collectives™ on Stack Overflow

HTML/CSS Obfuscation Compiling

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related