Setup de Vscode

Extensions firefox

• ColorPick eyedropper
• whatfont

Herramientas de web dev

Error lens
Live server
Live preview
code spell checker
quokka.js
ESLint
ConsoleNinja
Version Lens
Image preview

HTML TO CSS AUTOCOMPLETION
auto rename tag
JavaScript (ES6) code snippets

Herramientas de proposito general

prettier
Markdown preview enhanced
IntelliCode
code runner

Temas visuales e iconos

Fluent Icons
Vscode-icons
symbols

firefly pro 
GlassIt-VSC

OneDarkPro
Gruvbox theme

---

En Visual Studio Code (VSCode), existen varias extensiones útiles para mejorar la productividad al trabajar con CSS. Aquí te dejo una lista de algunas de las más recomendadas:

1. CSS Peek
   Permite visualizar las definiciones de clases, IDs y reglas CSS directamente desde el HTML o desde otros archivos CSS. Es ideal para navegar rápidamente entre el código.

2. Auto Rename Tag
   Esta extensión es muy útil cuando se edita HTML y CSS a la vez. Permite renombrar etiquetas automáticamente en ambos archivos (HTML y CSS) cuando se renombra una clase o id.

3. Prettier - Code formatter
   Prettier es un formateador de código que soporta múltiples lenguajes, incluyendo CSS. Asegura que el código esté bien formateado automáticamente al guardar el archivo.

4. PostCSS Language Support
   Si usas PostCSS (por ejemplo, para procesar características como variables, mixins o autoprefixer), esta extensión agrega soporte de sintaxis y autocompletado.

5. IntelliSense for CSS, SCSS, and Less
   Ofrece autocompletado, sugerencias y documentación integrada para CSS, SCSS y Less, lo que facilita la escritura de código al proporcionar sugerencias de propiedades y valores.

6. CSS Comb
   Una herramienta para ordenar las reglas CSS de manera consistente según las configuraciones de estilo que elijas, ayudando a mantener el código limpio y ordenado.

7. Sass (Sass Formatter)
   Si trabajas con Sass, esta extensión te ayudará a mantener un formato consistente en tus archivos .scss o .sass. Puedes configurar reglas de estilo para el formateo.

8. Color Highlight
   Resalta los valores de color en el código (como #ff0000, rgb(255, 0, 0), etc.) mostrando el color real directamente en el código, facilitando la visualización rápida.

9. CSS Modules
   Si trabajas con CSS Modules en aplicaciones React u otras tecnologías, esta extensión ayuda a mejorar la integración al proporcionar autocompletado y resaltado de sintaxis.

10. Stylelint
    Es un linteador para CSS que permite detectar errores de estilo, malas prácticas y problemas potenciales en tu código CSS. Se puede configurar para usar reglas específicas del equipo o proyecto.

11. Less IntelliSense
    Si usas Less como preprocesador CSS, esta extensión proporciona soporte de autocompletado y resaltado de sintaxis para archivos .less.

Estas extensiones pueden ayudarte a escribir y mantener tu código CSS de manera más eficiente y ordenada en VSCode.