CSS

A linguagem que controla a aparência dos elementos HTML na tela: cor, fonte, layout, espaçamento, responsividade.

Hard

O que é

CSS é a linguagem que define como o HTML aparece, cuidando de cor, fonte, layout, espaçamento, animação e comportamento responsivo. O HTML dá a estrutura do conteúdo, e o CSS é quem transforma essa marcação crua em interface de verdade, que se adapta a telas diferentes.

Pra quem faz design de produto, conhecer CSS por cima ajuda bastante a conversar com a engenharia e a entender o que é fácil ou caro de implementar. Sistemas de layout como Flexbox e Grid, junto das variáveis de CSS, são justamente o que sustenta o design system e o dark mode no código.

Não é preciso virar quem programa o CSS no dia a dia. O que ajuda é entender o suficiente pra alinhar o que o design pede com o que o navegador consegue entregar, sem prometer algo que vai custar caro depois.

Em uma frase

Saber um pouco de CSS me ajuda a entender se esse espaçamento é fácil ou caro de fazer.

A pergunta que ele responde

Quanto de CSS eu preciso saber pra conversar bem com a engenharia?

Quando usar

Use ao alinhar viabilidade visual com a engenharia e ao entender o que o front-end consegue de fato entregar.

Como não usar

O cuidado é não achar que precisa dominar CSS pra opinar em design. O que de fato ajuda é a alfabetização técnica, e não virar dev.

Na prática

Pense numa pessoa de design pedindo um espaçamento que parece simples, e a engenharia explicando que o componente usa Flexbox. Saber o básico de CSS torna essa conversa rápida, em vez de virar um vai e volta confuso.

Não confunda com

Vale separar CSS de HTML. O HTML define o que o conteúdo é, ou seja, a estrutura, enquanto o CSS define como ele aparece, ou seja, a apresentação. Os dois trabalham juntos o tempo todo, mas resolvem coisas diferentes.

Em inglês

Cascading Style Sheets (CSS)

Pronúncia

cê-éss-éss

Também chamado de

CSS, folha de estilo

Origem

Håkon Wium Lie e Bert Bos (W3C).

Fonte

Saiba mais

MDN Web Docs, documentação de referência sobre CSS.