Rodada 1 · anexo de estilo

Os ícones dos chips de ramo: 3 exemplos pra aprovar o estilo

O emoji sai. Emoji é fonte do sistema: o mesmo bolo muda de cara entre iPhone e Android, e a grade colorida faz a tela parecer seletor de delivery. Aqui estão três desenhos na mesma régua - marmita, bolo e salgado - pra você aprovar a régua, não os onze. Os outros 8 só depois do ok.

Lado a lado, a 375 px

Mesma largura de tela, mesmo chip, mesma palavra. À esquerda o que está no ar hoje; à direita os três desenhos novos, em 18 px, na cor do texto do chip.

hoje · emoji do sistema

Prefere escolher o ramo? Toca no que você vende

proposta · desenho da casa

Prefere escolher o ramo? Toca no que você vende

Os dois quadros usam as cores reais da casa e não seguem o tema de quem olha - é a tela real que está em julgamento.

Legível a 18 px e a 44 px

18 px é o tamanho dentro do chip. 44 px é o teste do desenho: se o traço só faz sentido grande, ele não serve pro chip; se some pequeno, também não. Nenhum dos três muda de leitura entre um e outro.

Marmitas 18 px 44 px o que é a caixa com a tampa e a divisória

Doces e bolos 18 px 44 px o que é bolo inteiro, uma camada marcada, sem vela

Salgados 18 px 44 px o que é a gota da coxinha com o corte

currentColor: o mesmo desenho em quatro tenants

Nenhuma cor está escrita dentro do SVG. O ícone herda a cor do texto onde estiver, então ele acompanha a marca de cada negócio sem nenhum arquivo novo - é o mesmo mecanismo do --brand por tenant. O emoji não faz isso: ele chega com a cor de fábrica da fonte do aparelho, sempre.

tinta (padrão)

teal da casa

tenant vinho

tenant roxo

O mesmo arquivo, quatro cores. No chip, o ícone fica na cor do texto - apoio, não protagonista.

A régua, em uma frase

viewBox 24x24, traço 1.8 em currentColor, pontas e junções redondas, área útil 18x18 centrada, no máximo 2 traços internos, zero preenchimento sólido - e o significado mora na palavra, o ícone é apoio.

viewBox 24x24, sempre. É a mesma caixa dos ícones de linha que o app já usa.
stroke 1.8, sem exceção. Herdado do que já existe na casa: 1.6 nos ícones de produto e 1.9 nos de interface do mockup da faixa. 1.8 é a régua única daqui pra frente.
stroke-linecap e stroke-linejoin round, os dois. Nada de ponta quadrada em ícone nenhum.
currentColor e fill="none". Nenhuma cor escrita no arquivo - é isso que faz o ícone seguir o whitelabel.
Área útil 18x18 centrada: nada de desenho encosta antes de 3 nem depois de 21, em nenhum eixo. Sobra de 3 de cada lado pro traço não cortar quando o ícone for rasterizado.
No máximo 2 traços internos além da silhueta. Marmita: tampa e divisória. Bolo: o glacê ondulado e a camada. Salgado: só o corte.
Sem preenchimento sólido, sem cor de acento, sem duas cores. Um traço só.
18 px no chip. Se o desenho precisa ser maior pra ser entendido, o desenho está errado - a palavra ao lado é que carrega o significado.

Os outros 8 só depois do ok.

Faltam comida caseira, pães e fermentados, lanches, açaí e copos, japonesa e oriental, pizzas e massas, festas e eventos, saudável e fit. Nenhum deles foi desenhado de propósito: o que está em julgamento aqui é a régua, e desenhar onze antes de ela ser aprovada é refazer onze depois.

Nada disto está no ar. Os chips de 2. Primeira tela continuam com emoji até você aprovar; o corte do emoji e os 8 restantes entram no mesmo pacote, depois do ok.

Estilo herdado do que você já elogiou: a escada de três degraus e os blocos do cardápio da página 3. A faixa (SVG inline, traço 3 em viewBox 96x62, para miniatura grande) e os ícones de linha do próprio app. Estes aqui são a versão pequena da mesma mão.