conic-gradient vs svg,img

Sameer Malik — Sun, 09 Apr 2023 03:38:19 +0000

<div class="span">G</div>
and css

<style>
    @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@700&family=Red+Hat+Display:wght@800&display=swap");
    .span {
      width: 200px;
      height: 200px;
      background: conic-gradient(
        #eb4132 0% 24%,
        #4086f4 24% 38%,
        #31aa52 38% 63%,
        #fbbd00 63% 86%,
        #eb4132 86% 100%
      );
      padding-left: 57px;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      font-size: 162px;
      font-family: "Red Hat Display", sans-serif;
    }
  </style>

DEV Community: Sameer Malik

conic-gradient vs svg,img