Generated by SassMeister.com.

input.scss

@keyframes rotation {
    @for $i from 0 through 47 {
        #{$i / 47 * 100}% {
            background-position: calc(#{$i} * -464px) 0;
        }
    }
}

// background-image: url("./assets/rotation/coin_rotation_2s#{$i}.jpg");

output.css

@keyframes rotation {
  0% {
    background-position: calc(0 * -464px) 0;
  }
  2.1276595745% {
    background-position: calc(1 * -464px) 0;
  }
  4.2553191489% {
    background-position: calc(2 * -464px) 0;
  }
  6.3829787234% {
    background-position: calc(3 * -464px) 0;
  }
  8.5106382979% {
    background-position: calc(4 * -464px) 0;
  }
  10.6382978723% {
    background-position: calc(5 * -464px) 0;
  }
  12.7659574468% {
    background-position: calc(6 * -464px) 0;
  }
  14.8936170213% {
    background-position: calc(7 * -464px) 0;
  }
  17.0212765957% {
    background-position: calc(8 * -464px) 0;
  }
  19.1489361702% {
    background-position: calc(9 * -464px) 0;
  }
  21.2765957447% {
    background-position: calc(10 * -464px) 0;
  }
  23.4042553191% {
    background-position: calc(11 * -464px) 0;
  }
  25.5319148936% {
    background-position: calc(12 * -464px) 0;
  }
  27.6595744681% {
    background-position: calc(13 * -464px) 0;
  }
  29.7872340426% {
    background-position: calc(14 * -464px) 0;
  }
  31.914893617% {
    background-position: calc(15 * -464px) 0;
  }
  34.0425531915% {
    background-position: calc(16 * -464px) 0;
  }
  36.170212766% {
    background-position: calc(17 * -464px) 0;
  }
  38.2978723404% {
    background-position: calc(18 * -464px) 0;
  }
  40.4255319149% {
    background-position: calc(19 * -464px) 0;
  }
  42.5531914894% {
    background-position: calc(20 * -464px) 0;
  }
  44.6808510638% {
    background-position: calc(21 * -464px) 0;
  }
  46.8085106383% {
    background-position: calc(22 * -464px) 0;
  }
  48.9361702128% {
    background-position: calc(23 * -464px) 0;
  }
  51.0638297872% {
    background-position: calc(24 * -464px) 0;
  }
  53.1914893617% {
    background-position: calc(25 * -464px) 0;
  }
  55.3191489362% {
    background-position: calc(26 * -464px) 0;
  }
  57.4468085106% {
    background-position: calc(27 * -464px) 0;
  }
  59.5744680851% {
    background-position: calc(28 * -464px) 0;
  }
  61.7021276596% {
    background-position: calc(29 * -464px) 0;
  }
  63.829787234% {
    background-position: calc(30 * -464px) 0;
  }
  65.9574468085% {
    background-position: calc(31 * -464px) 0;
  }
  68.085106383% {
    background-position: calc(32 * -464px) 0;
  }
  70.2127659574% {
    background-position: calc(33 * -464px) 0;
  }
  72.3404255319% {
    background-position: calc(34 * -464px) 0;
  }
  74.4680851064% {
    background-position: calc(35 * -464px) 0;
  }
  76.5957446809% {
    background-position: calc(36 * -464px) 0;
  }
  78.7234042553% {
    background-position: calc(37 * -464px) 0;
  }
  80.8510638298% {
    background-position: calc(38 * -464px) 0;
  }
  82.9787234043% {
    background-position: calc(39 * -464px) 0;
  }
  85.1063829787% {
    background-position: calc(40 * -464px) 0;
  }
  87.2340425532% {
    background-position: calc(41 * -464px) 0;
  }
  89.3617021277% {
    background-position: calc(42 * -464px) 0;
  }
  91.4893617021% {
    background-position: calc(43 * -464px) 0;
  }
  93.6170212766% {
    background-position: calc(44 * -464px) 0;
  }
  95.7446808511% {
    background-position: calc(45 * -464px) 0;
  }
  97.8723404255% {
    background-position: calc(46 * -464px) 0;
  }
  100% {
    background-position: calc(47 * -464px) 0;
  }
}

settings.json

{
  "sass": {
    "compiler": "dart-sass/1.32.12",
    "extensions": {},
    "syntax": "SCSS",
    "outputStyle": "expanded"
  },
  "autoprefixer": false
}