Generatore Media Query CSS
Genera media query CSS visivamente. Preset per breakpoint responsive, modalità scura e stampa. Copia il codice CSS. Gratuito, 100% nel browser.
Riferimento
Cosa sono le media query CSS?
Le media query (@media) sono regole che applicano stili CSS condizionalmente in base alle caratteristiche del dispositivo (larghezza schermo, risoluzione, combinazione di colori ecc.). Sono il fondamento del web design responsivo, permettendo a un unico HTML di adattarsi a diversi dispositivi.
Caratteristiche media
width / min-width / max-width — larghezza del viewport. La più usata nel design responsivo. prefers-color-scheme — preferenza dell'utente per il tema (light o dark). Per la modalità scura. prefers-reduced-motion — preferenza per il movimento ridotto. Importante per l'accessibilità. orientation — orientamento del dispositivo (portrait/landscape). print — stili specifici per la stampa.
Privacy
Tutta la generazione avviene al 100% nel tuo browser. Nessun dato viene inviato a server.