Instead bitmaps, SVG image sprites is the best way to optimise the delivery of your images.
Always set size’s classes, like .img-5x. Use 100% for a responsive image.
<svg class="img-svg {img-2x|img-3x|img-4x|img-5x}">
<use xlink:href="//design.umbler.com//assets/svg/sprite-umbler.svg#{image-name}"></use>
</svg> Add class .img-logo-inverse or .img-inverse-primary in logo and favicon svg.
<svg class="img-svg img-logo-inverse" style="width:150px;height:41px">
<use xlink:href="//design.umbler.com//assets/svg/sprite-umbler.svg#img-umbler-logo"></use>
</svg>
<svg class="img-svg img-4x img-logo-inverse">
<use xlink:href="//design.umbler.com//assets/svg/sprite-umbler.svg#img-umbler-favicon"></use>
</svg>
<svg class="img-svg img-4x img-inverse-primary">
<use xlink:href="//design.umbler.com//assets/svg/sprite-umbler.svg#img-umbler-favicon"></use>
</svg> Choose the {image-name} below.
img-u-webapps
img-u-mail
img-u-domain
img-u-addons
img-u-database
img-app-domain
img-app-email
img-app-site
img-u-webapps
img-u-domain
img-u-mail
img-u-database
img-app-payment
img-umbler-heart
img-umbler-logo
img-umbler-favicon
img-umblercoin-gold
img-umblercoin-silver
img-deploy-ftps
img-deploy-github
img-deploy-git-ssh
img-deploy-git-remote
img-deploy-goodbyehost
img-deploy-upload
img-auto-recharge
img-app-recharge
img-app-help
img-account
img-account-new
img-refer-friend
img-credit-card
img-credit-card-verse
img-site-new
img-email-new
img-email-new-contact
img-exchange
img-email-csv
img-email-csv-contact
img-new-writer
img-tag-feedback
img-logo-amex
img-logo-diners
img-logo-discover
img-logo-elo
img-logo-mastercard
img-logo-paypal
img-logo-paypal-symbol
img-logo-visa
SVG for Everybody adds SVG External Content support to all browsers.
<!--[if IE 9]>
<script src="https://cdn.jsdelivr.net/svg4everybody/2.1.3/svg4everybody.min.js"></script>
<script>svg4everybody();</script>
<![endif]-->