Utilities
CSS Minifier
Online CSS Minifier Tool and Compressor, with Fast and Simple API Access
Input CSS
.hub-intro h1{
	font-size: 1.7em;
    font-weight: 600;
}

.hub1-intro h1{

}

.hub-graphic img, .hub1-graphic img {
    opacity: .1;
}

.herocontent{
	padding:0;
}

.hub-graphic {
    position: absolute;
    top: -7px;
    left: -12px;
    width: 250px;
}

.hub1-graphic {
    position: absolute;
    top: -7px;
    left: -12px;
}

.herocontent-img {
    padding: 50px 0;
}

.hub-headline {
    text-align: center;
    position:relative;
}

.orange-head h2 {
    color: #1D3C6D;
}

.main-head h2 {
    font-weight: 900;
    font-size: 7rem;
    margin-bottom:-5px;
}

.sub-head {
    color: #003a70;
    margin-bottom: 15px;
}

.sub-head a {
    text-decoration: underline;
}

.hub-divider{
	margin-bottom:50px;
}

.resource h3 {
    font-size: 2rem;
    font-weight: 600;
}

.resource-action img {
    width: 35px;
    margin-right: 10px;
}

.resource-action {
    margin-top: 20px;
}

.resource-action a {
    font-weight: 600;
}

.resource-border {
    height: 1px;
    border-bottom: 1px solid #d1d1d1;
    padding: 10px 0;
}

a.blog-hub-topic {
    color: #f09c21;
    border: 1px solid #f09c21;
    border-radius: 25px;
    padding: 10px 20px;
    display: inline-block;
    margin: 5px 8px;
}

a.blog-hub-topic:last-child {
    color: white;
    background: #f09c21;
}

a.blog-hub-topic:hover {
    background: #eee;
    color: #f09c21;
    text-decoration:none;
}

.read-flex-container {
    margin-bottom: 50px;
}

.hub-margin {
    margin-top: 50px;
}

.resource-border:last-child {
    display: none;
}

.link-margin {
    margin-top: 25px;
}

@media (min-width: 768px){
.resource-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.main-head h2 {
    font-size: 15rem;
    margin-bottom: 0;
    opacity: .15;
}

.sub-head {
    position: absolute;
    top: 0;
    top: 50%;
    transform: translateY(-25%);
    -webkit-transform: translateY(-25%);
        -ms-transform: translateY(-25%);
            transform: translateY(-25%);
    left: 0;
    right: 0;
    font-size: 2.3rem;
    line-height: 2.7rem;
}
}


@media (min-width: 992px){
.hub-divider{
	margin-bottom:100px;
}

.hub-intro h1 {
    font-size: 3em;
}

.hub-graphic {
    width: 375px;
}

.main-head h2 {
    margin-top: 0;
}

.main-head h2 {
    font-size: 19vw;
}

.read-flex-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.learn-flex-container {
    display: flex;
    align-items: end;
}

.discover-headline {
    float: left;
    margin: 0 0 -4% -15px;
}

.watch-headline {
    margin-bottom: -4%;
}

.col-xs-12.hub-padding {
    padding: 0;
}

.link-margin {
    margin-top: 75px;
}

.hub-margin {
    margin-top: 0;
}

.read-subhead {
    padding: 0 10%;
}

.learn-subhead {
    padding: 0 18%;
}
}


@media (min-width: 1200px){
.herocontent-img {
    padding: 75px 0;
}

.hub-graphic {
    position: relative;
    width:450px
}

.hub1-graphic {
    /*position: relative;
    width:450px*/
}

.sub-head {
    font-size: 2.8rem;
    line-height:2.8rem;
}
}

@media (min-width: 1400px){
.main-head h2 {
    font-size: 26rem;
}

.watch-headline, .discover-headline {
    margin-bottom: -57px;
}
}

@media (min-width: 1600px){
.hub-padding{
	padding:0 10%;
}
}
Minified CSS Output

.hub-graphic,.hub1-graphic{position:absolute;top:-7px;left:-12px}.hub-intro h1{font-size:1.7em;font-weight:600}.hub-graphic img,.hub1-graphic img{opacity:.1}.herocontent{padding:0}.hub-graphic{width:250px}.herocontent-img{padding:50px 0}.hub-headline{text-align:center;position:relative}.orange-head h2{color:#1d3c6d}.main-head h2{font-weight:900;font-size:7rem;margin-bottom:-5px}.resource h3,.resource-action a{font-weight:600}.sub-head{color:#003a70;margin-bottom:15px}.sub-head a{text-decoration:underline}.hub-divider,.read-flex-container{margin-bottom:50px}.resource h3{font-size:2rem}.resource-action img{width:35px;margin-right:10px}.resource-action{margin-top:20px}.resource-border{height:1px;border-bottom:1px solid #d1d1d1;padding:10px 0}a.blog-hub-topic{color:#f09c21;border:1px solid #f09c21;border-radius:25px;padding:10px 20px;display:inline-block;margin:5px 8px}a.blog-hub-topic:last-child{color:#fff;background:#f09c21}a.blog-hub-topic:hover{background:#eee;color:#f09c21;text-decoration:none}.hub-margin{margin-top:50px}.resource-border:last-child{display:none}.link-margin{margin-top:25px}@media (min-width:768px){.resource-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.main-head h2{font-size:15rem;margin-bottom:0;opacity:.15}.sub-head{position:absolute;top:50%;-webkit-transform:translateY(-25%);-ms-transform:translateY(-25%);transform:translateY(-25%);left:0;right:0;font-size:2.3rem;line-height:2.7rem}}@media (min-width:992px){.hub-divider{margin-bottom:100px}.hub-intro h1{font-size:3em}.hub-graphic{width:375px}.main-head h2{margin-top:0;font-size:19vw}.read-flex-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.learn-flex-container{display:flex;align-items:end}.discover-headline{float:left;margin:0 0 -4% -15px}.watch-headline{margin-bottom:-4%}.col-xs-12.hub-padding{padding:0}.link-margin{margin-top:75px}.hub-margin{margin-top:0}.read-subhead{padding:0 10%}.learn-subhead{padding:0 18%}}@media (min-width:1200px){.herocontent-img{padding:75px 0}.hub-graphic{position:relative;width:450px}.sub-head{font-size:2.8rem;line-height:2.8rem}}@media (min-width:1400px){.main-head h2{font-size:26rem}.discover-headline,.watch-headline{margin-bottom:-57px}}@media (min-width:1600px){.hub-padding{padding:0 10%}}

CSS Minifier Tool Documentation
The API has changed, to see more please click here

To minify/compress your CSS, perform a POST request to

API https://www.toptal.com/developers/cssminifier/api/raw

with the input parameter set to the CSS you want to minify.
Hire World Class Talent with Toptal

    CSS Developers
    Landing Page Designers
    Animation Designers
    Web Developers
    Social Media Designers
    Webflow Designers
    Blog Designers
    Salesforce Consultants
    Mobile UI Designers
    WPF Developers
    Level Designers
    Mobile Game Designers
    CSS3 Developers
    VBA Developers
    Marketo Developers

Hire the top 3% of freelance talent
Join the Toptal Network

Copyright 2010 - 2025 Toptal, LLC

    Privacy Policy
    Website terms

By continuing to use this site you agree to our Cookie Policy Privacy Policy, and Terms of Use.