severity.svg

<svg width="204" height="20" viewBox="0 0 2040 200" xmlns="http://www.w3.org/2000/svg">
  <linearGradient id="a" x2="0" y2="100%">
    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
    <stop offset="1" stop-opacity=".1"/>
  </linearGradient>
  <mask id="m"><rect width="2040" height="200" rx="30" fill="#FFF"/></mask>
  <g mask="url(#m)">
    <rect width="840" height="200" fill="#555"/>
    <rect width="300" height="200" fill="#dc0000" x="840"/>
    <rect width="300" height="200" fill="#fd8c00" x="1140"/>
    <rect width="300" height="200" fill="#fdc500" x="1440"/>
    <rect width="300" height="200" fill="#4cae4c" x="1740"/>
  </g>
  <g fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
    <text x="60" y="148" textLength="730" fill="#000" opacity="0.25">dependencies</text>
    <text x="50" y="138" textLength="730">dependencies</text>
    <!-- Critical -->
    <text x="960" y="148" textLength="182" fill="#000" opacity="0.25">5</text>
    <text x="950" y="138" textLength="182">5</text>
    <!-- High -->
    <text x="1260" y="148" textLength="182" fill="#000" opacity="0.25">2</text>
    <text x="1250" y="138" textLength="182">2</text>
    <!-- Medium -->
    <text x="1560" y="148" textLength="182" fill="#000" opacity="0.25">0</text>
    <text x="1550" y="138" textLength="182">0</text>
    <!-- Low -->
    <text x="1860" y="148" textLength="182" fill="#000" opacity="0.25">4</text>
    <text x="1850" y="138" textLength="182">4</text>
  </g>
</svg>