Huruf berstail dengan bayang-bayang

Hang
pi
mana?

"Tak kemana-mana, dok ghumah hadap komputer"

HTML view ▼

<div style="
  background: #cfe2f3;
  border-radius: 50%;
  font-family: cursive;
  font-size: 20vmin;
  line-height: 0.8;
  margin: 0;
  letter-spacing: 0.075ch;
  color: hsl(30 88.6% 79.4%);
  text-align: center;
  --light-pos-x: 1; 
  --light-pos-y: -1;
  --rim-size: .02ch;
  --shadow-offset: .2ch;
  --shadow-blur: .1ch;
  text-shadow: 
    calc(max(var(--rim-size), 1px) * var(--light-pos-x)) calc(max(var(--rim-size), 1px) * var(--light-pos-y)) hsl(0 0% 100%),
    calc(max(var(--rim-size), 1px) * var(--light-pos-x) * -1) calc(max(var(--rim-size), 1px) * var(--light-pos-y) * -1) hsl(0 0% 60%),
    calc(var(--shadow-offset) * var(--light-pos-x) * -1) calc(var(--shadow-offset) * var(--light-pos-y) * -1) var(--shadow-blur) hsl(0 0% 50% / .75);">Hang<br/>pi<br/>mana?<br/></div>
<br/>
<div style="color: #6fa8dc; font: 300 22px Cherry Cream Soda; text-shadow: #783f06 0px 1px 0px, #444 0px 2px 0px;">
  "Tak kemana-mana, dok ghumah hadap komputer"</div>
<br/>

Tutup