HTML and CSS only license badge, see [Badge-Poser](https://github.com/PUGX/badge-poser)

fiddle.css

.badge {
    font-family: DejaVu Sans, Verdana, Geneva, sans-serif;
    font-size: 11px;
    color: white;
}

.badge.tag {
    background-color: #4c4c4c;
    padding: 2px 4px 3px 7px;
    border-radius: 4px 0 0 4px;
}

.badge.value {
    padding: 2px 7px 3px 4px;
    border-radius: 0 4px 4px 0;
}

.badge.license {
    background-color: #487;
}

.badge.build-passing {
    background-color: #4b2;
}

.badge.build-failing {
    background-color: #c54;
}

.badge.build-error {
    background-color: #888;
}

.badge.stable-version {
    background-color: #29c;
}

.badge.unstable-version {
    background-color: #c72;
}

.badge.downloads {
    background-color: #17b;
}

fiddle.html

<span class="badge tag">license</span><span class="badge value license">MIT</span>
<span class="badge tag">build</span><span class="badge value build-passing">passing</span>
<span class="badge tag">build</span><span class="badge value build-failing">failing</span>
<span class="badge tag">build</span><span class="badge value build-error">error</span>
<span class="badge tag">stable</span><span class="badge value stable-version">v2.0</span>
<span class="badge tag">unstable</span><span class="badge value unstable-version">v2.1-dev</span>
<span class="badge tag">downloads</span><span class="badge value downloads">2.14k</span>