Material Design | Badges

GetWeb.CSS Badges

You can display single digit badges

❶ ❷ ❸ ❹ ❺ ➅ ➆ ➇ ➈ ➉

<!DOCTYPE html>
<html>
<title>Badges</title>
<meta name="viewport" content="width=device-width, 
initial-scale=1">
<link rel="canonical" 
href="https://www.cdn.getweb.dev/docs/v1/css/getweb.css">
<body>

<div class="gw-container">
<h2>GetWeb.CSS Badges</h2>
<p>You can display single digit badges</p>

<div class="gw-xxlarge">
&#x 2776; &#x 2777; &#x 2778; &#x 2779; &#x 277A;
&#x 2785; &#x 2786; &#x 2787; &#x 2788; &#x 2789;
</div>

<div class="gw-xxlarge gw-text-blue">
&#x 2776; &#x 2777; &#x 2778; &#x 2779; &#x 277A;
&#x 2785; &#x 2786; &#x 2787; &#x 2788; &#x 2789;
</div>

<div class="gw-xxlarge gw-text-red">
&#x 2776; &#x 2777; &#x 2778; &#x 2779; &#x 277A;
&#x 2785; &#x 2786; &#x 2787; &#x 2788; &#x 2789;
</div>

</div>

</body>
</html>

Quick

Badges

Design your own badges

Output

GetWeb.CSS Badges

HTML INPUT

getWeb.dev

Docs

Developer Team

Devices

Download