For a full comparison of minifiers, jump to https://methodfish.com/Articles/minifiers

JShrink

This is a demonstration of the css minifier using JShrink class

Input css:

/*!
 * This is an "important" comment
 * 'Date: 27-27'
 */

@keyframes animating {
    0% {
        top: -50px;
        opacity: 0;
    }

4% {
        top: 20px;
        opacity:  1;
        /* This is a basic // block comment */
    }
}

input.admin[type='search'] {
    width:calc(100% - 4px); /* Can't see why but these seem to behave differently from standard search/text fields - see timesheet.php Contact tab */
    /* something else:0px */;
}
.wrapper {
    grid-template-columns:185px 1fr 1fr;
    grid-template-rows:auto auto   auto auto   1fr auto;
    grid-template-areas:
            "header  header header"
            "heading heading heading"
            "foot foot foot"
            ;
}
.rot {
    transform:  rotate(-10deg);
}
.rot {
    padding:10px   10px 20px 20px;
}
@media screen and (max-width:1600px) {
    .headlines, .sidebar {
        width:calc(100% - 40px)!important;
        background-color:black;
        color:#c98e8e;
    }
}
.rot {
    margin:0px;
    xcolor:red;
}

Output:

/*!
 * This is an "important" comment
 * 'Date: 27-27'
 */
@keyframes animating{0%{top:-50px;opacity:0;}
4%{top:20px;opacity:1;}}
input.admin[type='search']{width:calc(100%-4px);;}.wrapper{grid-template-columns:185px 1fr 1fr;grid-template-rows:auto auto auto auto 1fr auto;grid-template-areas:"header  header header""heading heading heading""foot foot foot";}.rot{transform:rotate(-10deg);}.rot{padding:10px 10px 20px 20px;}
@media screen and(max-width:1600px){.headlines,.sidebar{width:calc(100%-40px)!important;background-color:black;color:#c98e8e;}}.rot{margin:0px;xcolor:red;}

Minify time: 0.0014 seconds; 580 bytes 56.86% of original size (from 1020 bytes).