timer.css

html, body {
    margin: 0;
    height: 100%;
}
  
svg#clock {
    display: block;
    margin: 0 auto;
    background-color: #000;
}
  
#hand {
    fill: #fff;
    stroke: #fff;
    animation: time 3s ease infinite;
}
  
#hand line {
    stroke-linecap: round;
}
  
@keyframes time {
    0%   { transform: rotate(  0deg); stroke-width: 24; }
    4%   { transform: rotate(  0deg); stroke-width:  6; }
    33%  { transform: rotate(120deg); stroke-width:  6; }
    66%  { transform: rotate(240deg); stroke-width:  6; }
    88%  { transform: rotate(360deg); stroke-width:  6; }
    92%  { transform: rotate(360deg); stroke-width: 24; }
    96%  { transform: rotate(360deg); stroke-width:  6; }
    100% { transform: rotate(360deg); stroke-width: 24; }
}

timer.svg