Tema con ancho variable dentro de la configuración

¡Hola de nuevo!

Quiero añadir configuraciones a mi tema, pero tengo algunas preguntas al respecto.

Investigué el componente welcome-banner porque hay una opción para subir una imagen como fondo y otras configuraciones relacionadas con el fondo.

banner_background_image:
  type: upload
  default: ""

banner_background_repeat:
  type: enum
  default: no-repeat
  choices:
    - no-repeat
    - repeat
    - repeat-x
    - repeat-y

banner_background_size:
  type: string
  default: cover
  description: usa la propiedad ..... CSS background size</a>

Y en el archivo CSS está esto:

.welcome-link-banner-wrapper {
    background-color: #{$banner-background-color};
    background-image: url(#{$banner-background-image});
    background-size: #{$banner-background-size};
    background-repeat: #{$banner-background-repeat};
    background-position: center center;
  }

Lo que me irrita ahora es el uso de # en lugar de $ como en otros componentes que he visto.
Entonces, ¿qué necesito usar? ¿O no importa?

Tengo otra pregunta sobre CSS, pero primero quiero resolver la anterior.
Por supuesto que podría intentarlo, pero quiero estar seguro de cuál es la correcta.