Pular para o conteúdo

Gerador de Media Queries CSS

Crie CSS Media Queries visualmente. Escolha presets para mobile, tablet, desktop, impressão e acessibilidade. Copie o código CSS. Grátis, 100% no seu navegador.

Condições
Presets
Saída CSS
 

O que são Media Queries?

As CSS Media Queries permitem aplicar estilos condicionalmente com base nas características do dispositivo, como largura da tela, esquema de cores ou preferências do usuário. São a base do design web responsivo.

Propriedades comuns

width / height — dimensões do viewport com prefixos min-/max-. prefers-color-scheme — detecta modo claro ou escuro. prefers-reduced-motion — respeita configurações de acessibilidade. print — estilos específicos para impressão.

Privacidade

Todo o processamento é executado 100% no seu navegador. Nenhum dado é enviado a servidores.