Drop Caps

Basic

 
font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Helvetica', sans-serif;
  float: left;
  font-size: calc(4.3567*1em);
  line-height: 1.0616;
}

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. 

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Tahoma', sans-serif;
  float: left;
  font-size: calc(4.2981875*1em);
  line-height: 1.07603496;
}

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. 


            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Verdana', sans-serif;
  float: left;
  font-size: calc(4.2981875*1em);
  line-height: 1.07603496;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Times New Roman', serif;
  float: left;
  font-size: calc(4.7197625*1em);
  line-height: 0.97992219;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Courier New', monospace;
  float: left;
  font-size: calc(5.4700875*1em);
  line-height: 0.8455075;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display+SC:ital,wght@0,400;0,700;0,900;1,400;1,700;1,900&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  float: left;
  font-size: calc(5.4700875*1em);
  line-height: 0.8455075;
  font-family: 'Playfair Display SC', serif;
  font-weight: 900;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Yesteryear&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Yesteryear', cursive;
  float: left;
  font-size: calc(4.04806875*1em);
  line-height: 1.14252012;
  margin-right: 0.12em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'UnifrakturMaguntia', cursive;
  float: left;
  font-size: calc(4.54223125*1em);
  line-height: 1.01822205;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=New+Rocker&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'New Rocker', cursive;
  float: left;
  font-size: calc(4.2633*1em);
  line-height: 1.08484038;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Fruktur:ital@0;1&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Fruktur', system-ui;
  float: left;
  font-size: calc(4.18574375*1em);
  line-height: 0.8;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
        

      

      

        
          
Colorful

        
        

          
            
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Montserrat', sans-serif;
  float: left;
  font-size: calc(5.35714375*1em);
  line-height: 0.86333319;
  font-weight: 900;
  color: rgba(25%, 65%, 90%, 1);
  padding: 0.117em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Alfa Slab One', serif;
  float: left;
  font-size: calc(5.62339375*1em);
  line-height: 0.82245708;
  background: linear-gradient(#833ab4, #fd1d1d,#fcb045 );
  background-clip: text;
  color: transparent;
  padding: 0.111em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Bungee+Outline&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Bungee Outline', sans-serif;
  float: left;
  font-size: calc(7.8125*1em);
  line-height: 0.912;
  background: linear-gradient(-86deg, #EEF85B 5%, #7AEC8D 53%, #09E5C3 91%);
  background-clip: text;
  color: transparent;
  padding: 0.08em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: sans-serif;
  float: left;
  font-size: calc(7.8125*1em);
  line-height: 0.912;
  font-weight: bold;
  background: linear-gradient(135deg, #ff9a9e, #fbc2eb, #a18cd1, #fad0c4);
  background-clip: text;
  color: transparent;
  display: inline-block;
  padding: 0 0.1em;
  margin-right: 0.1em;
  border-radius: 0.2em;
  box-shadow: inset 0 -0.008em 5px rgba(255, 255, 255, 0.4), 0.008em 0.008em 0.04em rgba(0,0,0,0.1);
  background-blend-mode: screen;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Alfa Slab One', serif;
  float: left;
  font-size: calc(5.62339375*1em);
  line-height: 0.82245708;
  background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="a" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 408.352 408.353"><defs><style>.ag{fill:url(%23k);}.ah{fill:url(%23j);}.ai{fill:url(%23i);}.aj{fill:url(%23h);}.ak{fill:url(%23p);}.al{fill:url(%23m);}.am{fill:url(%23n);}.an{fill:url(%23l);}.ao{fill:url(%23g);}.ap{fill:url(%23f);}.aq{fill:url(%23e);}.ar{fill:url(%23d);}.as{fill:url(%23q);}.at{fill:url(%23o);}.au{fill:url(%23r);}.av{fill:url(%23s);}.aw{fill:url(%23c);}.ax{fill:url(%23b);}.ay{fill:url(%23u);}.az{fill:url(%23w);}.ba{fill:url(%23v);}.bb{fill:url(%23t);}.bc{fill:url(%23z);}.bd{fill:url(%23y);}.be{fill:url(%23x);}.bf{fill:url(%23af);}.bg{fill:url(%23aa);}.bh{fill:url(%23ae);}.bi{fill:url(%23ac);}.bj{fill:url(%23ab);}.bk{fill:url(%23ad);}</style><linearGradient id="b" x1="-212.45" y1="1987.032" x2="195.899" y2="1987.032" gradientTransform="translate(162.363 131.053) rotate(-30) scale(.042)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="%23fc354c"/><stop offset=".205" stop-color="%2329abe2"/><stop offset=".425" stop-color="%23662d91"/><stop offset=".622" stop-color="%231b1464"/><stop offset=".811" stop-color="%23fbb03b"/><stop offset="1" stop-color="%230abfbc"/></linearGradient><linearGradient id="c" x1="526.151" y1="1713.523" x2="934.501" y2="1713.523" gradientTransform="translate(162.873 126.773) rotate(-5) scale(.047)" xlink:href="%23b"/><linearGradient id="d" x1="1024.57" y1="1209.484" x2="1432.913" y2="1209.484" gradientTransform="translate(165.397 122.701) rotate(20) scale(.052)" xlink:href="%23b"/><linearGradient id="e" x1="1239.416" y1="608.789" x2="1647.783" y2="608.789" gradientTransform="translate(169.85 119.786) rotate(45) scale(.058)" xlink:href="%23b"/><linearGradient id="f" x1="1186.178" y1="37.087" x2="1594.54" y2="37.087" gradientTransform="translate(175.704 118.942) rotate(70) scale(.065)" xlink:href="%23b"/><linearGradient id="g" x1="925.305" y1="-408.977" x2="1333.646" y2="-408.977" gradientTransform="translate(181.994 120.841) rotate(95) scale(.072)" xlink:href="%23b"/><linearGradient id="h" x1="542.848" y1="-673.603" x2="951.2" y2="-673.603" gradientTransform="translate(187.438 125.706) rotate(120) scale(.08)" xlink:href="%23b"/><linearGradient id="i" x1="130.238" y1="-743.976" x2="538.595" y2="-743.976" gradientTransform="translate(190.634 133.162) rotate(145) scale(.089)" xlink:href="%23b"/><linearGradient id="j" x1="-233.091" y1="-644.447" x2="175.267" y2="-644.447" gradientTransform="translate(190.352 142.171) rotate(170) scale(.098)" xlink:href="%23b"/><linearGradient id="k" x1="-491.58" y1="-425.063" x2="-83.227" y2="-425.063" gradientTransform="translate(185.838 151.111) rotate(-165) scale(.109)" xlink:href="%23b"/><linearGradient id="l" x1="-618.992" y1="-147.807" x2="-210.64" y2="-147.807" gradientTransform="translate(177.093 157.994) rotate(-140) scale(.122)" xlink:href="%23b"/><linearGradient id="m" x1="-617.454" y1="126.817" x2="-209.104" y2="126.817" gradientTransform="translate(165.056 160.819) rotate(-115) scale(.135)" xlink:href="%23b"/><linearGradient id="n" x1="-511.747" y1="350.233" x2="-103.398" y2="350.233" gradientTransform="translate(151.608 158.011) rotate(-90) scale(.15)" xlink:href="%23b"/><linearGradient id="o" x1="-340.554" y1="492.264" x2="67.8" y2="492.264" gradientTransform="translate(139.384 148.868) rotate(-65) scale(.167)" xlink:href="%23b"/><linearGradient id="p" x1="-146.885" y1="542.994" x2="261.465" y2="542.994" gradientTransform="translate(131.368 133.922) rotate(-40) scale(.185)" xlink:href="%23b"/><linearGradient id="q" x1="30.381" y1="510.719" x2="438.731" y2="510.719" gradientTransform="translate(130.313 115.106) rotate(-15) scale(.206)" xlink:href="%23b"/><linearGradient id="r" x1="162.693" y1="416.963" x2="571.044" y2="416.963" gradientTransform="translate(138.087 95.663) rotate(10) scale(.229)" xlink:href="%23b"/><linearGradient id="s" x1="234.958" y1="290.167" x2="643.308" y2="290.167" gradientTransform="translate(155.046 79.735) rotate(35) scale(.254)" xlink:href="%23b"/><linearGradient id="t" x1="245.673" y1="159.252" x2="654.027" y2="159.252" gradientTransform="translate(179.602 71.658) rotate(60) scale(.282)" xlink:href="%23b"/><linearGradient id="u" x1="204.621" y1="48.392" x2="612.973" y2="48.392" gradientTransform="translate(208.124 75.056) rotate(85) scale(.314)" xlink:href="%23b"/><linearGradient id="v" x1="128.97" y1="-26.419" x2="537.324" y2="-26.419" gradientTransform="translate(235.25 91.87) rotate(110) scale(.349)" xlink:href="%23b"/><linearGradient id="w" x1="38.807" y1="-58.665" x2="447.161" y2="-58.665" gradientTransform="translate(254.67 121.54) rotate(135) scale(.387)" xlink:href="%23b"/><linearGradient id="x" x1="-47" y1="-50.674" x2="361.351" y2="-50.674" gradientTransform="translate(260.294 160.538) rotate(160) scale(.43)" xlink:href="%23b"/><linearGradient id="y" x1="-113.954" y1="-11.519" x2="294.398" y2="-11.519" gradientTransform="translate(247.645 202.449) rotate(-175) scale(.478)" xlink:href="%23b"/><linearGradient id="z" x1="-153.672" y1="45.886" x2="254.681" y2="45.886" gradientTransform="translate(215.227 238.715) rotate(-150) scale(.531)" xlink:href="%23b"/><linearGradient id="aa" x1="-164.236" y1="107.818" x2="244.117" y2="107.818" gradientTransform="translate(165.553 260.012) rotate(-125) scale(.59)" xlink:href="%23b"/><linearGradient id="ab" x1="-149.297" y1="162.35" x2="259.056" y2="162.35" gradientTransform="translate(105.529 258.133) rotate(-100) scale(.656)" xlink:href="%23b"/><linearGradient id="ac" x1="-116.369" y1="201.149" x2="291.984" y2="201.149" gradientTransform="translate(45.968 228.054) rotate(-75) scale(.729)" xlink:href="%23b"/><linearGradient id="ad" x1="-74.753" y1="220.272" x2="333.6" y2="220.272" gradientTransform="translate(.113 169.796) rotate(-50) scale(.81)" xlink:href="%23b"/><linearGradient id="ae" x1="-33.534" y1="220.042" x2="374.819" y2="220.042" gradientTransform="translate(-18.707 89.598) rotate(-25) scale(.9)" xlink:href="%23b"/><linearGradient id="af" x1="0" y1="204.176" x2="408.352" y2="204.176" gradientTransform="matrix(1,0,0,1,0,0)" xlink:href="%23b"/></defs><path class="ax" d="M204.19,212.835c-.752,0-1.509-.099-2.254-.299-2.233-.598-4.1-2.03-5.256-4.032-1.156-2.002-1.463-4.335-.865-6.568.599-2.233,2.031-4.1,4.033-5.255,2.003-1.157,4.334-1.463,6.568-.865,2.232.598,4.099,2.031,5.255,4.033h0c2.387,4.132.966,9.437-3.167,11.823-1.334.77-2.814,1.163-4.314,1.163ZM204.164,196.79c-1.279,0-2.542.335-3.679.993-1.708.986-2.93,2.578-3.441,4.483-.51,1.905-.249,3.895.738,5.602.986,1.709,2.578,2.931,4.483,3.441,1.903.51,3.895.249,5.603-.738,3.526-2.036,4.738-6.561,2.702-10.086h0c-.985-1.708-2.578-2.93-4.483-3.44-.636-.17-1.281-.255-1.923-.255Z"/><path class="aw" d="M204.169,213.794c-4.928,0-9.136-3.78-9.574-8.78-.462-5.283,3.459-9.956,8.742-10.418,2.557-.227,5.053.562,7.021,2.213,1.968,1.651,3.175,3.97,3.398,6.529.462,5.283-3.46,9.957-8.742,10.419-.283.024-.565.037-.845.037ZM204.19,195.972c-.242,0-.485.011-.729.032-4.506.395-7.852,4.381-7.458,8.888.395,4.506,4.375,7.855,8.888,7.458,2.183-.19,4.161-1.221,5.569-2.899s2.079-3.805,1.888-5.988c-.19-2.183-1.22-4.161-2.898-5.569-1.491-1.251-3.336-1.92-5.26-1.92Z"/><path class="ar" d="M204.165,214.862c-1.211,0-2.441-.208-3.644-.646-5.537-2.015-8.401-8.159-6.386-13.695.976-2.682,2.938-4.823,5.525-6.03,2.586-1.206,5.489-1.332,8.17-.357,5.536,2.016,8.401,8.16,6.386,13.696h0c-1.577,4.334-5.686,7.031-10.052,7.031ZM204.17,195.056c-1.312,0-2.621.288-3.847.859-2.207,1.029-3.881,2.856-4.713,5.144-1.719,4.723.725,9.964,5.448,11.684,4.722,1.719,9.964-.725,11.684-5.448h0c1.719-4.723-.726-9.964-5.448-11.684-1.017-.37-2.071-.555-3.123-.555Z"/><path class="aq" d="M204.176,216.044c-3.04,0-6.081-1.157-8.396-3.472-4.629-4.63-4.629-12.162,0-16.792s12.162-4.629,16.791,0c4.629,4.629,4.629,12.162,0,16.792-2.314,2.314-5.355,3.472-8.396,3.472ZM204.176,194.053c-2.594,0-5.187.987-7.162,2.961-3.949,3.949-3.949,10.375,0,14.324s10.376,3.949,14.323,0c3.949-3.949,3.949-10.375,0-14.324-1.974-1.974-4.567-2.961-7.161-2.961Z"/><path class="ap" d="M204.19,217.369c-5.391,0-10.463-3.33-12.41-8.682-2.488-6.834,1.049-14.419,7.884-16.908,6.834-2.486,14.42,1.049,16.909,7.884,2.487,6.836-1.05,14.421-7.885,16.909h0c-1.483.54-3.004.796-4.498.796ZM204.165,192.922c-1.275,0-2.571.218-3.838.679-5.831,2.123-8.848,8.593-6.726,14.424,2.122,5.83,8.592,8.85,14.425,6.726,5.83-2.122,8.848-8.592,6.725-14.424-1.661-4.564-5.987-7.405-10.586-7.405Z"/><path class="ao" d="M204.203,218.835c-.433,0-.867-.019-1.304-.058-3.9-.341-7.435-2.18-9.951-5.179-2.517-3-3.715-6.799-3.374-10.7.341-3.9,2.181-7.435,5.18-9.951,3-2.516,6.805-3.714,10.699-3.374,8.052.705,14.028,7.828,13.324,15.879-.341,3.901-2.181,7.435-5.18,9.952-2.664,2.234-5.96,3.43-9.396,3.43ZM204.155,191.671c-2.933,0-5.744,1.02-8.016,2.927-2.559,2.147-4.128,5.162-4.419,8.489-.291,3.328.731,6.569,2.878,9.127,2.146,2.559,5.162,4.128,8.489,4.418h0c3.328.292,6.568-.729,9.127-2.877,2.559-2.146,4.128-5.161,4.42-8.489.6-6.869-4.499-12.945-11.367-13.546-.372-.033-.743-.049-1.111-.049Z"/><path class="aj" d="M204.15,220.47c-2.822,0-5.608-.74-8.117-2.189-3.768-2.175-6.462-5.688-7.588-9.889-1.125-4.202-.548-8.591,1.627-12.358,4.491-7.777,14.473-10.45,22.248-5.961,3.767,2.175,6.462,5.687,7.588,9.889s.548,8.591-1.627,12.358-5.688,6.462-9.89,7.588c-1.402.376-2.827.562-4.241.562ZM204.2,190.286c-4.806,0-9.485,2.492-12.056,6.944-1.855,3.214-2.349,6.958-1.388,10.542.96,3.585,3.259,6.581,6.473,8.437,3.213,1.855,6.956,2.352,10.543,1.388,3.585-.96,6.581-3.259,8.437-6.474,1.855-3.213,2.349-6.957,1.388-10.542-.961-3.585-3.26-6.581-6.474-8.437-2.182-1.26-4.567-1.858-6.923-1.858Z"/><path class="ai" d="M204.214,222.276c-1.056,0-2.119-.092-3.181-.279-4.76-.84-8.909-3.482-11.681-7.441h0c-2.772-3.96-3.837-8.762-2.998-13.522s3.482-8.909,7.441-11.681c3.959-2.773,8.764-3.838,13.521-2.998,4.761.839,8.909,3.482,11.682,7.441,2.772,3.96,3.837,8.762,2.997,13.522-.839,4.761-3.482,8.909-7.441,11.681-3.076,2.154-6.662,3.277-10.341,3.277ZM191.53,213.03c4.883,6.973,14.529,8.673,21.5,3.791,3.378-2.365,5.633-5.903,6.349-9.964s-.192-8.158-2.557-11.535c-4.884-6.973-14.528-8.673-21.5-3.791-3.378,2.365-5.632,5.904-6.349,9.965-.716,4.061.192,8.158,2.557,11.535h0Z"/><path class="ah" d="M204.132,224.288c-4.088,0-8.071-1.248-11.489-3.642-4.399-3.08-7.335-7.689-8.268-12.979-.933-5.29.25-10.625,3.331-15.024s7.69-7.336,12.979-8.269c10.922-1.931,21.368,5.392,23.294,16.31.932,5.289-.251,10.625-3.332,15.024-3.08,4.399-7.689,7.336-12.979,8.269-1.18.208-2.362.311-3.535.311ZM204.184,187.022c-.985,0-1.983.085-2.986.262-9.314,1.643-15.556,10.556-13.914,19.871h0c.796,4.512,3.301,8.444,7.054,11.072,3.753,2.629,8.311,3.638,12.816,2.841,4.513-.795,8.444-3.3,11.072-7.053s3.638-8.305,2.842-12.817c-1.466-8.311-8.721-14.176-16.884-14.176Z"/><path class="ag" d="M204.212,226.526c-1.94,0-3.894-.255-5.819-.771-5.764-1.544-10.582-5.24-13.565-10.408-2.984-5.168-3.777-11.188-2.232-16.953h0c3.188-11.899,15.464-18.987,27.362-15.797,11.899,3.189,18.985,15.463,15.797,27.361-1.544,5.765-5.241,10.582-10.409,13.565-3.441,1.987-7.263,3.003-11.134,3.003ZM185.767,199.244h0c-1.317,4.917-.641,10.053,1.904,14.461,2.545,4.409,6.655,7.562,11.572,8.88,4.917,1.316,10.053.642,14.462-1.904,4.408-2.545,7.562-6.655,8.88-11.572,1.317-4.917.641-10.053-1.904-14.461-2.546-4.408-6.655-7.562-11.572-8.879-10.151-2.72-20.621,3.326-23.342,13.476Z"/><path class="an" d="M204.133,229.002c-5.821,0-11.401-2.024-15.914-5.81-5.079-4.263-8.195-10.247-8.772-16.853-.578-6.605,1.452-13.041,5.713-18.12h0c4.262-5.079,10.247-8.194,16.852-8.772,6.613-.576,13.04,1.452,18.119,5.713,5.08,4.262,8.195,10.247,8.773,16.852.578,6.605-1.451,13.04-5.713,18.119-4.263,5.08-10.247,8.195-16.853,8.773-.738.064-1.475.097-2.206.097ZM204.212,182.999c-.625,0-1.252.027-1.882.083-5.635.493-10.74,3.151-14.376,7.484h0c-3.636,4.333-5.367,9.822-4.874,15.457.493,5.634,3.151,10.74,7.484,14.375,8.944,7.508,22.327,6.335,29.833-2.609,3.637-4.333,5.367-9.822,4.874-15.458-.493-5.635-3.15-10.74-7.483-14.376-3.849-3.229-8.61-4.956-13.575-4.956Z"/><path class="al" d="M204.193,231.772c-3.182,0-6.372-.558-9.45-1.678-6.923-2.521-12.45-7.585-15.563-14.262-6.427-13.784-.443-30.226,13.34-36.654h0c13.788-6.428,30.227-.441,36.654,13.341,6.427,13.783.442,30.226-13.341,36.653-3.708,1.729-7.667,2.6-11.64,2.6ZM194.232,182.852c-11.758,5.483-16.863,19.51-11.38,31.268,2.656,5.696,7.371,10.017,13.277,12.166,5.906,2.15,12.294,1.87,17.991-.785,5.696-2.656,10.017-7.372,12.166-13.277,2.149-5.906,1.87-12.295-.785-17.991-2.656-5.696-7.372-10.017-13.277-12.167-5.904-2.149-12.294-1.871-17.991.786h0Z"/><path class="am" d="M204.176,234.821c-16.898,0-30.646-13.747-30.646-30.645s13.748-30.646,30.646-30.646,30.646,13.748,30.646,30.646-13.747,30.645-30.646,30.645ZM204.176,178.033c-14.416,0-26.143,11.728-26.143,26.143s11.728,26.143,26.143,26.143,26.144-11.728,26.144-26.143-11.729-26.143-26.144-26.143Z"/><path class="at" d="M204.156,238.245c-4.905,0-9.792-1.073-14.37-3.208-8.243-3.844-14.496-10.668-17.607-19.215s-2.707-17.793,1.137-26.037c7.935-17.016,28.235-24.405,45.251-16.47,8.243,3.844,14.496,10.667,17.606,19.214,3.111,8.547,2.707,17.793-1.137,26.037-3.844,8.242-10.668,14.495-19.215,17.606-3.8,1.383-7.739,2.071-11.666,2.071ZM204.22,175.13c-10.947,0-21.447,6.212-26.371,16.77-3.279,7.032-3.623,14.92-.969,22.211,2.653,7.291,7.988,13.112,15.02,16.391,7.032,3.28,14.92,3.624,22.211.971,7.291-2.654,13.112-7.988,16.391-15.021,3.279-7.032,3.624-14.92.971-22.211s-7.988-13.112-15.021-16.391c-3.958-1.846-8.127-2.72-12.231-2.72Z"/><path class="ak" d="M204.241,242.014c-1.116,0-2.237-.049-3.362-.146-10.067-.881-19.189-5.63-25.685-13.372-6.496-7.741-9.588-17.549-8.708-27.617.88-10.067,5.629-19.189,13.371-25.685,15.981-13.408,39.893-11.315,53.302,4.664h0c6.496,7.742,9.589,17.549,8.708,27.617s-5.63,19.189-13.372,25.685c-6.875,5.771-15.383,8.855-24.254,8.855ZM204.151,171.915c-7.324,0-14.685,2.472-20.721,7.537-6.604,5.542-10.655,13.323-11.406,21.911-.751,8.588,1.887,16.955,7.429,23.559,5.542,6.604,13.323,10.655,21.911,11.407,8.601.754,16.955-1.887,23.559-7.429,6.604-5.542,10.655-13.323,11.407-21.912.751-8.588-1.887-16.955-7.428-23.559h0c-6.375-7.597-15.533-11.515-24.75-11.515Z"/><path class="as" d="M204.186,246.219c-18.56,0-35.589-12.402-40.615-31.163-2.907-10.845-1.415-22.174,4.199-31.898s14.68-16.681,25.526-19.586c22.391-6,45.486,7.335,51.486,29.725h0c5.999,22.391-7.336,45.487-29.726,51.486-3.629.973-7.279,1.437-10.87,1.437ZM204.167,168.311c-3.064,0-6.175.396-9.273,1.226-9.252,2.479-16.986,8.413-21.775,16.709-4.79,8.295-6.062,17.959-3.583,27.211,5.118,19.1,24.819,30.475,43.922,25.358,19.098-5.117,30.472-24.821,25.356-43.921h0c-4.287-16.002-18.815-26.583-34.647-26.583Z"/><path class="au" d="M204.199,250.89c-2.684,0-5.401-.232-8.133-.715-12.287-2.166-22.995-8.987-30.151-19.208-7.156-10.22-9.904-22.615-7.738-34.901,4.473-25.365,28.754-42.361,54.11-37.889,25.364,4.473,42.361,28.746,37.889,54.11h0c-3.991,22.632-23.749,38.603-45.977,38.603ZM204.091,164.32c-8.101,0-15.995,2.473-22.77,7.217-8.718,6.104-14.538,15.239-16.386,25.72s.496,21.056,6.601,29.773c6.105,8.719,15.239,14.538,25.721,16.386,21.637,3.821,42.343-10.687,46.161-32.32h0c3.815-21.638-10.684-42.345-32.321-46.16-2.337-.412-4.679-.616-7.004-.616Z"/><path class="av" d="M204.065,256.089c-10.551,0-20.833-3.221-29.657-9.399-23.441-16.415-29.159-48.84-12.745-72.281,16.414-23.44,48.839-29.158,72.281-12.745,11.355,7.951,18.936,19.849,21.343,33.5,2.407,13.652-.646,27.425-8.598,38.779-7.951,11.356-19.849,18.936-33.501,21.344-3.044.536-6.095.802-9.123.802ZM204.239,159.918c-13.969,0-27.727,6.578-36.33,18.864-14.002,19.997-9.124,47.658,10.873,61.661,9.687,6.782,21.441,9.389,33.082,7.334,11.646-2.054,21.796-8.521,28.579-18.207h0c6.782-9.688,9.388-21.436,7.334-33.082-2.054-11.646-8.52-21.795-18.206-28.579-7.712-5.399-16.564-7.992-25.332-7.992Z"/><path class="bb" d="M204.27,261.866c-5.009,0-10.051-.658-15.019-1.989-14.878-3.987-27.313-13.528-35.015-26.868-7.701-13.34-9.747-28.879-5.761-43.758,3.986-14.878,13.528-27.313,26.868-35.015,13.34-7.702,28.88-9.745,43.758-5.761,14.878,3.987,27.313,13.529,35.015,26.868s9.747,28.879,5.761,43.758c-3.987,14.878-13.528,27.313-26.868,35.015-8.885,5.13-18.747,7.75-28.738,7.75ZM204.095,154.962c-8.524,0-16.936,2.235-24.516,6.612-11.379,6.57-19.519,17.178-22.92,29.87-3.401,12.692-1.655,25.948,4.915,37.328,6.57,11.379,17.178,19.52,29.87,22.92,12.691,3.4,25.948,1.656,37.328-4.914,11.379-6.569,19.52-17.178,22.92-29.87,3.401-12.692,1.656-25.949-4.914-37.328-6.569-11.379-17.178-19.519-29.87-22.92-4.237-1.136-8.54-1.698-12.812-1.698Z"/><path class="ay" d="M204.128,268.251c-32.83,0-60.867-25.184-63.781-58.49-1.492-17.049,3.746-33.659,14.747-46.77s26.449-21.152,43.498-22.644c17.046-1.494,33.66,3.746,46.769,14.747,13.111,11.001,21.152,26.449,22.645,43.498,3.079,35.195-23.05,66.334-58.245,69.413-1.888.165-3.771.246-5.632.246ZM204.216,149.516c-1.589,0-3.191.069-4.804.21-14.544,1.272-27.722,8.132-37.107,19.316-9.384,11.184-13.852,25.354-12.579,39.898,2.626,30.024,29.205,52.328,59.214,49.686,30.024-2.626,52.313-29.189,49.687-59.214-2.485-28.411-26.406-49.896-54.41-49.896Z"/><path class="ba" d="M204.104,275.372c-8.069,0-16.267-1.382-24.277-4.297h0c-36.887-13.427-55.975-54.36-42.549-91.248,6.503-17.87,19.577-32.137,36.811-40.173,17.234-8.035,36.567-8.881,54.436-2.376,17.869,6.504,32.137,19.577,40.173,36.812,8.037,17.234,8.881,36.567,2.377,54.436-10.511,28.877-37.883,46.847-66.971,46.847ZM183.404,261.245c31.469,11.453,66.387-4.83,77.84-36.298,5.549-15.243,4.829-31.735-2.027-46.437-6.855-14.702-19.026-25.855-34.271-31.403-15.241-5.548-31.734-4.828-46.437,2.028-14.702,6.856-25.854,19.026-31.403,34.27-11.453,31.468,4.83,66.387,36.298,77.84h0Z"/><path class="az" d="M204.176,283.241c-20.257,0-40.513-7.711-55.934-23.131h0c-30.841-30.843-30.841-81.026,0-111.868,14.941-14.94,34.805-23.168,55.934-23.168s40.993,8.228,55.934,23.168,23.169,34.805,23.169,55.934-8.229,40.994-23.169,55.934c-15.421,15.42-35.678,23.131-55.934,23.131ZM156.461,251.892c26.31,26.311,69.12,26.311,95.43,0,12.745-12.745,19.765-29.69,19.765-47.715s-7.02-34.97-19.765-47.715c-12.745-12.746-29.69-19.765-47.715-19.765s-34.97,7.019-47.715,19.765c-26.309,26.308-26.306,69.12,0,95.43h0Z"/><path class="be" d="M204.263,292.072c-35.914,0-69.701-22.183-82.678-57.836-16.576-45.54,6.989-96.075,52.53-112.65,22.059-8.03,45.927-6.988,67.206,2.934,21.276,9.921,37.416,27.535,45.445,49.596,8.03,22.061,6.988,45.928-2.934,67.206-9.922,21.276-27.535,37.416-49.597,45.445-9.887,3.599-20.014,5.306-29.973,5.306ZM204.221,129.16c-8.649,0-17.32,1.515-25.689,4.561-38.849,14.14-58.952,57.25-44.812,96.1,14.14,38.848,57.25,58.949,96.1,44.812,18.819-6.85,33.845-20.618,42.309-38.769s9.353-38.511,2.503-57.331-20.618-33.845-38.769-42.309c-10.079-4.7-20.842-7.064-31.642-7.064Z"/><path class="bd" d="M204.249,301.837c-2.84,0-5.703-.123-8.584-.375-53.643-4.693-93.467-52.154-88.773-105.797,2.273-25.986,14.53-49.531,34.512-66.298,19.983-16.767,45.307-24.749,71.284-22.476,53.644,4.693,93.468,52.153,88.774,105.796-4.441,50.763-47.18,89.149-97.213,89.149ZM114.038,196.29l7.147.625c-4.003,45.761,29.969,86.248,75.73,90.251,2.455.215,4.902.32,7.322.321,42.686.004,79.14-32.745,82.929-76.051,4.004-45.762-29.969-86.249-75.729-90.252-45.766-4.004-86.249,29.968-90.252,75.73l-7.147-.625Z"/><path class="bc" d="M203.993,312.662c-18.398,0-37.024-4.674-54.07-14.516-51.815-29.916-69.632-96.409-39.717-148.224,29.916-51.815,96.41-69.631,148.224-39.717,25.101,14.492,43.056,37.891,50.558,65.887,7.501,27.996,3.651,57.238-10.841,82.338-20.074,34.769-56.626,54.231-94.153,54.231ZM204.332,111.63c-32.016,0-63.192,16.601-80.318,46.264-25.521,44.202-10.321,100.925,33.881,126.446,44.199,25.519,100.924,10.321,126.445-33.882,12.362-21.412,15.646-46.357,9.247-70.239s-21.716-43.843-43.128-56.206c-14.539-8.394-30.435-12.383-46.127-12.383Z"/><path class="bg" d="M204.432,324.771c-7.036,0-14.119-.615-21.192-1.863-31.714-5.592-59.353-23.2-77.824-49.58-18.472-26.379-25.564-58.373-19.973-90.087,5.592-31.715,23.2-59.354,49.58-77.825,54.457-38.13,129.782-24.849,167.914,29.607,38.13,54.457,24.849,129.782-29.608,167.913-20.496,14.352-44.386,21.835-68.896,21.835ZM204.031,101.361c-20.372,0-40.93,6.02-58.847,18.565-22.504,15.757-37.524,39.335-42.295,66.39s1.28,54.348,17.038,76.852,39.335,37.524,66.39,42.295c27.057,4.771,54.348-1.281,76.852-17.038,46.455-32.527,57.785-96.785,25.257-143.241-19.982-28.538-51.947-43.823-84.395-43.823Z"/><path class="bj" d="M204.111,338.149c-63.755,0-120.414-45.8-131.859-110.711-12.827-72.744,35.919-142.36,108.663-155.187,35.238-6.215,70.788,1.667,100.098,22.191,29.311,20.524,48.875,51.233,55.089,86.472,12.826,72.744-35.92,142.36-108.663,155.188-7.832,1.381-15.635,2.048-23.327,2.048ZM204.418,89.869c-6.668,0-13.382.584-20.086,1.766-62.055,10.942-103.639,70.33-92.697,132.385,9.763,55.37,58.102,94.441,112.485,94.444,6.565,0,13.215-.569,19.899-1.748,62.055-10.941,103.639-70.329,92.696-132.385-5.3-30.061-21.989-56.258-46.994-73.766-19.428-13.604-42.071-20.697-65.304-20.697Z"/><path class="bi" d="M204.142,353.038c-12.719,0-25.633-1.645-38.49-5.089-79.276-21.242-126.491-103.021-105.249-182.297,10.29-38.403,34.919-70.5,69.351-90.379,34.431-19.879,74.544-25.159,112.946-14.87h0c79.276,21.242,126.491,103.021,105.249,182.297-17.797,66.42-78.096,110.338-143.807,110.338ZM203.97,77.147c-22.004,0-43.715,5.77-63.281,17.066-29.373,16.958-50.383,44.339-59.161,77.1-18.121,67.629,22.156,137.391,89.784,155.512,67.628,18.118,137.39-22.156,155.511-89.784,18.121-67.628-22.156-137.391-89.784-155.512-10.938-2.931-22.042-4.381-33.069-4.381Z"/><path class="bk" d="M203.891,369.573c-38.779,0-75.96-13.482-106.021-38.706-69.857-58.618-79.002-163.14-20.385-232.997,58.618-69.857,163.141-79,232.997-20.385h0c69.857,58.618,79.002,163.14,20.385,232.996-28.396,33.841-68.27,54.598-112.276,58.448-4.915.43-9.822.644-14.699.644ZM204.29,63.155c-40.296,0-80.321,17.124-108.189,50.335-50.005,59.593-42.204,148.757,17.39,198.762,28.868,24.225,65.448,35.759,102.982,32.47,37.541-3.284,71.557-20.991,95.779-49.859,50.002-59.589,42.194-148.755-17.389-198.762h0c-26.382-22.136-58.564-32.946-90.573-32.946Z"/><path class="bh" d="M204.457,387.925c-69.249,0-135.678-39.301-166.822-106.089C-5.187,190.004,34.685,80.456,126.516,37.634c44.485-20.743,94.386-22.921,140.509-6.135,46.124,16.788,82.949,50.532,103.693,95.017,42.821,91.831,2.948,201.379-88.883,244.201-25.043,11.678-51.413,17.207-77.379,17.207ZM204.083,47.334c-22.582,0-45.081,4.943-66.155,14.771C59.589,98.634,25.575,192.087,62.105,270.426c36.529,78.338,129.98,112.35,208.32,75.821,78.338-36.529,112.352-129.981,75.822-208.32-17.695-37.949-49.11-66.735-88.457-81.056-17.495-6.368-35.629-9.537-53.708-9.537Z"/><path class="bf" d="M204.176,408.353C91.593,408.353,0,316.76,0,204.176S91.593,0,204.176,0s204.176,91.593,204.176,204.176-91.593,204.176-204.176,204.176ZM204.176,30C108.135,30,30,108.135,30,204.176s78.135,174.176,174.176,174.176,174.176-78.135,174.176-174.176S300.217,30,204.176,30Z"/></svg>');
  background-clip: text;
  color: transparent;
  padding: 0.111em;
  background-size: 300%;
  background-position: left center;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Josefin Sans', sans-serif;
  float: left;
  font-size: calc(10.6837625*1em);
  line-height: 0.84239986;
  background: radial-gradient(closest-side,#FF8008,#FFC837,transparent);
  color: white;
  padding: 0.152em 0.058em 0 0.058em;
  font-weight: 100;
  margin: 0.006em 0.029em 0.006em 0.006em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Anton', sans-serif;
  float: left;
  font-size: calc(9.375*1em);
  line-height: 1;
  font-weight: 900;
  color: rgba(100%, 65%, 0%, 1);
  padding: 0.117em;
  margin-right: -6.667em;
  margin-left: -0.3em;
  margin-top: -0.4em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
        

      

      

        
          
Border

        
        

          
            
@import url('https://fonts.googleapis.com/css2?family=Rubik+Mono+One&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Rubik Mono One', monospace;
  float: left;
  font-size: calc(10.7142875*1em);
  line-height: 0.83999986;
  color: transparent;
  background-image: linear-gradient(135deg, #ff9a9e, #fad0c4, #fbc2eb, #a1c4fd);
  background-clip: text;
  padding: 0.1em;
  margin-right: 0.1em;
  border-radius: 0.047em;
  border: 0.023em solid transparent;
  border-image: linear-gradient(135deg, #ff9a9e, #fad0c4, #fbc2eb, #a1c4fd) 1;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Zen+Dots&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Zen Dots', monospace;
  float: left;
  font-size: calc(6.99300625*1em);
  line-height: 0.9295001;
  font-weight: 400;
  color: #ffe55c;
  background-color: #142daa;
  border: 0.036em solid #a4b6ff;
  border-radius: 0.107em;
  padding: 0.089em;
  margin-right: 0.054em;
  display: inline-block;
  line-height: 1;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Imbue:opsz,wght@10..100,100..900&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Imbue', serif;
  float: left;
  font-size: calc(5.80356875*1em);
  line-height: 0.95846198;
  padding: 0.215em;
  border: 0.032em solid rgb(100% 92.2% 0%);
  box-shadow: 0.01em 0.1em 0 rgb(100% 92.2% 0%);
  margin: 0 0.1em 0.1em 0;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Savate:ital,wght@0,200..900;1,200..900&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Savate', sans-serif;
  float: left;
  font-size: calc(5.80356875*1em);
  line-height: 0.95846198;
  font-weight: 900;
  padding: 0.215em;
  border-bottom: 0.1em solid #cfe8ca;
  margin: 0 0.1em 0.1em 0;
  color: #00251e;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Caprasimo&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Caprasimo', serif;
  font-weight: 400;
  float: left;
  font-size: calc(4.4630375*1em);
  line-height: 1.03628975;
  padding: 0.215em;
  border-bottom: 0.032em solid #780206;
  box-shadow: 0.025em 0.1em 0 #780206;
  margin: 0 0.1em 0.1em 0;
  background: linear-gradient(to bottom,#780206,#061161);
  background-clip: text;
  color: transparent;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Libre+Bodoni:ital,wght@0,400..700;1,400..700&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Libre Bodoni', serif;
  font-weight: 400;
  float: left;
  font-size: calc(8.289125*1em);
  line-height: 0.93495996;
  padding: 0.215em;
  border: 0.11em ridge #ff8b8e;
  margin: 0 0.1em 0.1em 0;
  color: #afeed1;
  background: #c08a8e;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
        

      

      

        
          
Shadowed

        
        

          
            
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  float: left;
  font-size: calc(8.92856875*1em);
  line-height: 0.86800026;
  color: #fff;
  background-image: radial-gradient(circle at 30% 30%, #ff6ec4, #7873f5);
  padding: 0.21em 0.35em;
  border-radius: 1em;
  box-shadow: 0 0 0.056em #ff6ec4, 0 0 0.112em #ff6ec4, 0.028em 0.028em 0.14em #7873f5, -0.028em -0.028em 0.14em #6ef5cb;
  margin: 0.05em 0.1em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
&::first-letter {
  font-family: 'IBM Plex Sans', sans-serif;
  font-weight: 700;
  float: left;
  font-size: calc(4.477075*1em);
  line-height: 1.03304055;
  color: #ffffff;
  background-color: #000000;
  padding: 0.1em 0.25em;
  border-radius: 0.2em;
  box-shadow: 0.04em 0.04em 0 #00ffff, -0.04em -0.04em 0 #ff00ff, 0.08em 0.08em 0 #ffcc00;
  margin: 0.1em 0.2em;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.
            

          
          
            
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap') layer(base);

font-size: 1em;
text-align: left;
line-height: 1.2;
max-width: 400px;
color: black;
&::first-letter {
  font-family: 'Manrope', sans-serif;
  font-weight: 800;
  float: left;
  font-size: calc(6.94444375*1em);
  line-height: 0.93600009;
  color: #ffffff;
  background-color: #00c2ff;
  padding: 0.09em 0.18em;
  border-radius: 0.09em;
  box-shadow: 0.045em 0.045em 0 #00ffd5, 0.09em 0.09em 0 #0080ff, 0.135em 0.135em 0 #00b894;
  margin: 0 0.3em 0.1em 0;
}

            

              Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
              eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
              voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
              voluptatem sequi nesciunt.