# Ideias de gradiente para doze setores, com códigos [Canonical HTML page](https://gradiently.design/pt-br/guide/gradient-ideas-by-industry) Um café não deve parecer um banco, e um banco não deve parecer uma balada. Doze setores, doze gradientes feitos para o seu clima e o design em que cada um se dá melhor. ## The short version - As melhores ideias de gradiente partem do que um negócio vende e de como ele quer que as pessoas se sintam, e não do gradiente que está na moda. - Gradientes quentes e escuros combinam com cafés e academias; gradientes suaves e de baixo contraste combinam com beleza e bem-estar; gradientes profundos e frios combinam com finanças e tecnologia. - A maioria dos setores tem um gradiente esperado, como azul para violeta na tecnologia, então acrescentar uma cor inesperada ou uma textura é o que torna o seu reconhecível. - Toda ideia de gradiente precisa de um design em que se dê bem: um post de cardápio para um café, uma contagem regressiva para uma academia, um comunicado limpo para uma empresa de finanças. - Mantenha o texto na parte mais calma do gradiente e use uma cor lisa tirada dele para tamanhos pequenos e logos. Boas **ideias de gradiente** combinam com o negócio antes de combinar com a tendência. As cores, o contraste e a direção devem dizer algo sobre o que você vende: quente e torrado para um café, ardente e veloz para uma academia, profundo e firme para uma empresa de finanças. Abaixo estão doze setores, cada um com um gradiente para copiar, uma paleta e o tipo de design em que se dá melhor. Use-os como ponto de partida e depois faça-os seus com as ideias do final. - Cafés: Crema de espresso: `linear-gradient(160deg, #3b2418 0%, #8a5a3b 50%, #e8d3b9 100%)` - Música: Show da madrugada: `linear-gradient(180deg, #0d0d12 0%, #1e2a78 60%, #00e0c6 100%)` - Eventos: Holofote: `radial-gradient(circle at 30% 20%, #ff3d8b 0%, #6a1b9a 45%, #120824 80%)` - Fitness: Calor: `linear-gradient(135deg, #ff5a1f 0%, #ff1f5a 55%, #2a0a2e 100%)` - Beleza: Argila rosada: `linear-gradient(160deg, #f6e7e1 0%, #eec1c0 50%, #c98b86 100%)` - Bem-estar: Névoa de sálvia: `linear-gradient(180deg, #e7efe6 0%, #b9cdb5 50%, #7f9c86 100%)` - Tecnologia: Sinal profundo: `linear-gradient(135deg, #0a0f2c 0%, #1d4ed8 50%, #22d3ee 100%)` - Finanças: Porto: `linear-gradient(160deg, #0f1c2e 0%, #1f4e5f 60%, #5f9e8f 100%)` - Educação: Página nova: `linear-gradient(135deg, #0e7c66 0%, #3fb68b 55%, #e8f5c8 100%)` - Moda: Nanquim ao cru: `linear-gradient(180deg, #111111 0%, #3a3632 55%, #e9e2d6 100%)` - Imóveis: Céu de calcário: `linear-gradient(180deg, #cfe3f3 0%, #f3ede4 60%, #b9a48c 100%)` - ONGs: Esperança quente: `linear-gradient(135deg, #e36b5d 0%, #f28c38 50%, #f6c35b 100%)` Doze ideias de gradiente, uma por setor. Cada uma é explicada na sua seção abaixo. ## Ideias de gradiente para cafés, música e eventos ### Cafés e restaurantes Comida pede calor. A crema de espresso vai de um marrom torrado, passando pelo caramelo, até um creme leitoso, e por isso lembra café antes de alguém ver a xícara. Ponha o cardápio ou o prato do dia na ponta clara, em texto marrom-escuro. O design em que mais se destaca é um post simples de cardápio com um título e um preço. [Branding para restaurantes](https://gradiently.design/pt-br/guide/cafe-restaurant-branding) trata do resto da identidade. - Espresso: #3b2418 - Caramelo: #8a5a3b - Crema: #e8d3b9 - Leite: #faf4ec - Acento tomate: #c8553d Paleta de café. O acento tomate é só para preços e pratos do dia. ### Música A arte de música costuma viver pequena, como um quadrado em um player, então precisa de um escuro forte e de uma cor viva que sobreviva ao tamanho de miniatura. O show da madrugada sobe de um quase preto por um índigo até um turquesa ácido, como luz escorrendo em um palco. Use em capas de playlist a 1080×1080 e em anúncios de lançamento. ### Eventos Eventos pegam emprestado da iluminação de palco: um holofote rosa quente que se dissolve em violeta e preto. Um gradiente radial faz isso melhor do que um linear, porque tem uma fonte. Ponha o nome do evento na área escura e a data na clara. [Branding para eventos](https://gradiently.design/pt-br/guide/event-branding) mostra como levá-lo do cartaz à pulseira. Um post vertical de café com o texto Flat white de aveia, o dia todo Ideia de café: uma linha, uma oferta, um fundo quente. Um story vertical de evento com o texto Portas às nove e os detalhes dos ingressos Ideia de evento: um story com o horário grande e os detalhes pequenos. ## Ideias de gradiente para fitness, beleza e bem-estar ### Fitness Gradientes de fitness devem parecer esforço: um laranja quente que vira um rosa-avermelhado e esmaece em um ameixa escuro. A diagonal acrescenta movimento. O texto branco se lê bem no canto escuro, então ponha ali os números, como repetições, tempos e datas de aula. Posts de contagem regressiva e anúncios de desafio são o seu lar natural. ### Beleza Beleza pede cores próximas da pele: porcelana, rubor e uma argila rosada, com pouco contraste entre os passos para o gradiente parecer suave e não gráfico. Um ameixa profundo é a âncora adulta para texto e logos. Combina com lançamentos de produto e posts de antes e depois, e fica bem com um grão fino. - Porcelana: #f6e7e1 - Rubor: #eec1c0 - Argila rosada: #c98b86 - Nude: #d9b8a0 - Ameixa: #5e2a3f Paleta de beleza. Quatro tons suaves e um ameixa profundo para as palavras. ### Bem-estar Bem-estar é desacelerar, então o gradiente dele deve ser o mais calmo daqui: de uma névoa clara a um verde-sálvia, de cima para baixo, com quase nenhum contraste. Mantenha o texto em verde-escuro, e não em preto. Uma única citação ou um convite para respirar em um story é o design para o qual ele foi feito. Um post vertical de fitness com o texto Seis semanas até seus primeiros 10K Ideia de fitness: uma contagem regressiva transforma uma aula em uma meta. Um story vertical com a frase Solte o ar mais devagar do que puxou Ideia de bem-estar: uma linha calma com espaço em volta. ## Ideias de gradiente para tecnologia, finanças e educação ### Tecnologia Os gradientes de tecnologia são os mais lotados de qualquer setor: azul-marinho, azul e violeta estão em toda parte. O sinal profundo mantém o marinho e o azul pela confiança, mas termina em ciano e não em violeta, o que já basta para sair do bando. Combina com peças de lançamento, posts de changelog e imagens Open Graph a 1200×630. ### Finanças Dinheiro pede calma e peso. O Porto vai de um marinho nanquim, passando por um azul-petróleo, até um turquesa-sálvia, com latão como um pequeno acento para números e títulos. Evita os verdes vivos dos gráficos de ações, que podem passar alarme tanto quanto crescimento. Mantenha os layouts simples: um número, uma frase. - Marinho nanquim: #0f1c2e - Porto: #1f4e5f - Turquesa-sálvia: #5f9e8f - Papel: #f4f1ea - Latão: #c9a24a Paleta de finanças. O papel é o fundo claro para relatórios; o latão é para um número por página. ### Educação Educação deve parecer fresca e encorajadora sem ficar infantil. A página nova vai de um verde profundo por um verde de primavera até um lima claro, como um caderno novo, com um acento amarelo de marca-texto (#ffd84d) para as palavras-chave. Use em posts de lista, dicas de revisão e anúncios de curso. Um post vertical intitulado Três jeitos de estudar melhor em um layout de lista Ideia de educação: um post de lista que as pessoas salvam e voltam a consultar. ## Ideias de gradiente para moda, imóveis e ONGs ### Moda Na moda, quem leva a cor são as roupas, então o gradiente é discreto e editorial: preto nanquim, passando por um carvão quente, até o cru, como o fundo de um estúdio. Ele emoldura as fotos de produto em vez de competir com elas. Lançamentos de produto e capas de lookbook são onde ele brilha, com uma única fonte elegante. Um post vertical de moda anunciando A seleção de outono, novidades Ideia de moda: um lançamento de produto em que o fundo emoldura em vez de gritar. ### Imóveis Imóveis vendem luz e espaço. O céu de calcário começa com um azul-céu claro, passa por um branco de reboco quente e assenta em um arenito, como uma fachada ao sol. Mantenha o texto dos anúncios em um ardósia profundo. Funciona em slides 16:9 a 1920×1080 e em banners de anúncio onde as fotos ficam por cima. ### ONGs ONGs precisam de calor e esperança sem parecer uma liquidação. A esperança quente vai do coral pelo laranja até o dourado, e um turquesa profundo dá ao texto e aos logos uma âncora séria. Combina com posts de campanha, números de impacto e convites para eventos, onde a mensagem importa mais do que o design. - Turquesa profundo: #0f4c5c - Coral: #e36b5d - Nascer do sol: #f28c38 - Dourado quente: #f6c35b - Creme: #fbf3e4 Paleta de ONG. Turquesa profundo para as palavras, os três quentes para o gradiente, creme para leitura longa. ## Como fazer um gradiente do seu setor ficar só seu Todo setor tem um gradiente esperado, e usá-lo diz às pessoas o que você faz. Isso é útil, mas também faz você parecer com todo mundo da sua categoria. O truque é manter o clima esperado e mudar uma coisa: uma cor, uma textura ou o jeito de se mover. A [psicologia das cores](https://gradiently.design/pt-br/guide/color-psychology) explica por que climas e cores se alinham, e o [branding com gradiente](https://gradiently.design/pt-br/guide/gradient-branding) mostra como transformar um deles em identidade. | Setor | O gradiente esperado | Uma variação para testar | | --- | --- | --- | | Tecnologia | Marinho, azul e violeta | Terminar em ciano ou lima em vez de violeta | | Finanças | Marinho para azul vivo | Petróleo e sálvia, com um acento de latão | | Fitness | Vermelho para laranja | Esmaecer em ameixa escuro para dar profundidade | | Beleza | Rosa claro para branco | Adicionar argila rosada e um grão fino | | Bem-estar | Verde claro para branco | Névoa para sálvia, com texto verde-escuro | | Cafés | Marrom liso | Espresso para crema com um acento tomate | Mantenha o clima que o setor espera e mude um elemento. Seja qual for o gradiente escolhido, teste-o com palavras de verdade antes de se comprometer; [texto sobre gradiente](https://gradiently.design/pt-br/guide/text-on-gradient) mostra onde o texto deve ficar. Se você prefere ter um visual que ninguém mais do seu setor possa usar, o [Mercado](/market) do Gradiently reúne Marks com exatamente um dono cada, e você pode projetar com qualquer um antes de reservar o seu. ## FAQ ### Quais cores de gradiente combinam com um café ou restaurante? Marrons quentes e cremes, como espresso #3b2418 para caramelo #8a5a3b para crema #e8d3b9, com um pequeno acento quente para preços e pratos do dia. ### Que gradiente funciona para uma marca de finanças? Tons frios, profundos e calmos, como marinho nanquim, azul-petróleo e turquesa-sálvia, com um pequeno acento de latão ou dourado. Mantenha o contraste alto para os números. ### Como evitar que meu gradiente de tecnologia fique igual ao de todo mundo? Mantenha o marinho e o azul que passam confiança, mas troque o violeta de sempre por uma cor menos esperada, como ciano ou lima, ou acrescente uma textura como grão. ### Quais gradientes combinam com marcas de bem-estar e beleza? Gradientes suaves e de baixo contraste: névoa para sálvia no bem-estar, porcelana para rubor e argila rosada na beleza. Combine-os com uma cor âncora profunda para o texto. ### O gradiente deve mesmo combinar com o meu setor? Em parte. Seguir o clima esperado ajuda as pessoas a entender o que você faz, enquanto mudar um elemento, uma cor, uma textura ou o movimento, o torna reconhecível dentro dele.