Numeric Analog Clock

<div class='ck'><small>CLOCK</small><svg id='cks' viewBox='0 0 100 100'></svg><div class='t' id='ckt'></div></div>

.ck{width:170px;margin:auto;padding:16px 14px 14px;background:#fff;border-radius:28px;box-shadow:0 10px 30px rgba(0,0,0,.1);text-align:center;font-family:Inter,Arial,sans-serif}.ck small{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;color:#9a9a9a}.ck svg{display:block;width:110px;height:110px;margin:10px auto 8px}.ck .t{font:11px ui-monospace,Menlo,monospace;letter-spacing:.06em;color:#444}

const S='http://www.w3.org/2000/svg';const sv=document.getElementById('cks');let g='<circle cx="50" cy="50" r="47" fill="#fff" stroke="#eee"/>';for(let i=0;i<60;i++){const a=i*6*Math.PI/180,m=i%5===0,r1=m?40:43,r2=46;g+='<line x1="'+(50+Math.sin(a)*r1)+'" y1="'+(50-Math.cos(a)*r1)+'" x2="'+(50+Math.sin(a)*r2)+'" y2="'+(50-Math.cos(a)*r2)+'" stroke="'+(m?'#bbb':'#e6e6e6')+'" stroke-width="'+(m?1.2:.6)+'"/>'}for(const n of [12,3,6,9]){const a=n*30*Math.PI/180;g+='<text x="'+(50+Math.sin(a)*33)+'" y="'+(50-Math.cos(a)*33+2.5)+'" text-anchor="middle" font-size="7" font-family="ui-monospace,monospace" fill="#444">'+n+'</text>'}g+='<line id="h" x1="50" y1="50" x2="50" y2="26" stroke="#111" stroke-width="3" stroke-linecap="round"/><line id="m" x1="50" y1="50" x2="50" y2="15" stroke="#111" stroke-width="2" stroke-linecap="round"/><line id="s" x1="50" y1="58" x2="50" y2="13" stroke="#ef4444" stroke-width=".9" stroke-linecap="round"/><circle cx="50" cy="50" r="2.4" fill="#111"/>';sv.innerHTML=g;const H=sv.querySelector('#h'),M=sv.querySelector('#m'),Sx=sv.querySelector('#s'),T=document.getElementById('ckt');const tick=()=>{const d=new Date(),s=d.getSeconds()+d.getMilliseconds()/1000,m=d.getMinutes()+s/60,h=d.getHours()%12+m/60;H.setAttribute('transform','rotate('+h*30+' 50 50)');M.setAttribute('transform','rotate('+m*6+' 50 50)');Sx.setAttribute('transform','rotate('+s*6+' 50 50)');T.textContent=d.toLocaleTimeString([],{hour:'2-digit',minute:'2-digit'}).toUpperCase();requestAnimationFrame(tick)};tick();