Sass permite el uso de dos sintaxis diferentes para crear sus archivos. La primera, conocida como SCSS (del inglés, Sassy CSS) es la que se utiliza en este manual y es una extensión de la sintaxis de CSS3. Esto significa que cualquier hoja de estilos CSS3 válida también es un archivo SCSS válido.
Además, SCSS es capaz de entender la mayoría de hacks de CSS y la sintaxis específica de los navegadores, como por ejemplo la vieja sintaxis filter de Internet Explorer. Obviamente esta sintaxis básica de CSS se ha mejorado con las características de Sass explicadas en los siguientes capítulos. Los archivos creados con esta sintaxis utilizan la extensión .scss.
La segunda sintaxis, conocida como "sintaxis indentada" o simplemente "sintaxis sass" permite escribir los estilos CSS de manera más concisa. En este caso, el anidamiento de selectores se indica con tabulaciones en vez de con llaves y las propiedades se separan con saltos de línea en vez de con puntos y coma.
Algunos diseñadores consideran que esta segunda sintaxis es más sencilla de leer y más rápida de escribir que SCSS. En cualquier caso, las dos sintaxis tienen exactamente las mismas funcionalidades y sólo se diferencia en su sintaxis. Los archivos creados con esta segunda sintaxis utilizan la extensión .sass.
Una de las ventajas de Sass es que los archivos creados con una sintaxis pueden importar cualquier archivo creado con la otra sintaxis. Además, dispones de una utilidad para la línea de comandos que te permite convertir una sintaxis en otra:
# Convierte un archivo Sass en SCSS
$ sass-convert estilos.sass estilos.scss
# Convierte un archivo SCSS en Sass
$ sass-convert estilos.scss estilos.sass