Yoube
Brand Manual · Nov · 2026

Simples.
Organizado.
Yoube.

Manual de marca para criações novas e futuras. Sistema de duas vozes — Bold & Atelier.
02modos de voz
01cor protagonista
01família tipográfica
v1.0edição vigente
01Essência

A plataforma que dá tempo de volta para quem faz beleza ser ofício.

A Yoube simplifica o dia a dia de mulheres empreendedoras dos segmentos de beleza e estética — profissionais autônomas, donas de salão e suas clientes. O manual abaixo orienta toda decisão de design e comunicação a partir de três pilares e duas vozes.

01 · PILAR

Feminilidade

Formas suaves, espaços que respiram, paleta acolhedora. Sem estereótipos — força em delicadeza.

02 · PILAR

Simplicidade

Menos é mais. Hierarquias claras, tipografia limpa e interfaces que tiram fricção, não a adicionam.

03 · PILAR

Confiança

Um SaaS que cabe na rotina. Tom direto, dados visíveis e fluxos previsíveis — para empreender com tranquilidade.

02O sistema · duas vozes

Uma marca. Duas vozes.
Sem perder identidade.

A Yoube fala alto quando precisa chamar — anúncios, hero, campanhas, capas. E fala baixo quando precisa cuidar — produto, papelaria, rotina. Tudo no mesmo roxo, na mesma tipografia, na mesma marca.

Modo · Bold
BELEZA
É OFÍCIO.

Tipografia massiva (Jakarta 800), roxo & preto em flood, cor pontual amarelo bolt para destaque. Voz declarativa, slogans, manifestos.

Quando usar
  • Hero de landing
  • Capa de campanha
  • Out of home
  • Anúncio pago
  • Capa de e-book
  • Brindes & totes
Modo · Atelier
Silêncio,
método
e simplicidade.

Tipografia leve (Jakarta 300 + 600), muito off-white (Linen), o roxo aparece como um único ponto. Voz instrutiva, calma, próxima.

Quando usar
  • Interface do produto
  • Newsletter / diário
  • Papelaria · cartões
  • Comunicação 1:1
  • Páginas internas
  • Editorial / blog

↑ Os dois modos compartilham logo, paleta e tipografia. O que muda é o peso, a quantidade de cor e o tom da copy.

03Logotipo

O logotipo é o ativo mais protegido da marca.

Três aplicações oficiais — lockup horizontal (primária), wordmark e símbolo. Mantenha-os sempre como recebidos. Não recrie, não desenhe à mão, não substitua a fonte.

Lockup · primário Lockup Yoube
Wordmark · inverso Wordmark Yoube
Símbolo Símbolo Yoube

Margem de respiro · 1×

Em toda aplicação, reserve pelo menos uma altura do símbolo em margem livre ao redor do logotipo. Tamanhos mínimos: lockup 120px de largura, wordmark 80px, símbolo 16px.

Não faça

×

Não altere as cores do logotipo.

× yoube

Não altere as fontes do logotipo.

×

Não rotacione ou deforme o logotipo.

×
PLATAFORMA · GESTÃO

Não adicione informações próximas ao logotipo.

04Cor

Roxo é o coração. Onyx sustenta. Linen acolhe.

Quatro cores principais formam a marca: Iris (roxo da Yoube), Onyx (preto profundo), Linen (off-white quente) e Bolt (amarelo pontual, só no modo Bold). Tudo o mais é hierarquia.

Cor primária

Iris

O roxo da Yoube. Aparece generoso no modo Bold e pontual no modo Atelier.

HEX · #7F6CFF
RGB · 127 / 108 / 255
CMYK · 68 / 62 / 0 / 0
Tinta

Onyx

Preto azulado. Sustenta o modo Bold e dá peso ao texto.

HEX · #1C1B22
RGB · 28 / 27 / 34
Papel

Linen

Off-white com toque quente. Fundo padrão do modo Atelier.

HEX · #FAF8F3
RGB · 250 / 248 / 243
Highlight · só Bold

Bolt

Amarelo voltagem. Use raramente — uma palavra por peça, no máximo.

HEX · #F4FF4D
RGB · 244 / 255 / 77

Iris · escala

Hierarquia roxa. Use 50–200 para fundos suaves, 400–600 para a marca, 700–900 para hover e texto sobre claros.

50F6F3FF
100EFEAFF
200DFD7FF
300C8C0FF
400A99CFF
5007F6CFF
6006952E8
7005B4CD8
8004536B0
9002E2380

Neutros

Onyx até Linen. Use para texto, bordas, fundos e elevação. Evite criar cinzas novos fora desta escala.

50FAF8F3
100F2EDE2
200E9E3D5
300D6CFBE
400A8A296
5006B6760
6004F4D58
7003A3845
8002A2832
9001C1B22

Cores semânticas · produto

Sucesso
#00D670

Confirmações, agendamentos pagos, status verde.

Atenção
#FFDA00

Avisos, pendências, lembretes.

Erro
#FF3A3A

Falhas, cancelamentos, ações destrutivas.

Informação
#2D8CFF

Dicas, links externos, contexto neutro.

05Tipografia

Plus Jakarta Sans — uma família, dois pesos protagonistas.

A mesma família tipográfica resolve toda a hierarquia. O peso é quem define a voz: 800 ExtraBold declara (modo Bold), 300 Light + 600 Semibold conversam (modo Atelier).

Modo Bold · 800 ExtraBold
AGENDA
CHEIA.
Tracking: −0.045em · Line-height: 0.88
Use para: hero, headlines, slogans, capas.
Modo Atelier · 300 + 600
Sua agenda,
seu ritmo.
Tracking: −0.025em · Line-height: 1.0
Use para: produto, editorial, papelaria.

Escala completa

Display · Bold96 / 92
weight 800
tracking −4.5%
Yoube.
H1 · Bold64 / 60
weight 800
tracking −4%
Agenda cheia, cabeça leve.
Display · Atelier56 / 56
weight 300 / 600
tracking −2.5%
Silêncio, método e simplicidade.
H244 / 46
weight 700
Sua agenda, sua vitrine
H332 / 38
weight 600
Clientes que voltam sempre
H424 / 30
weight 600
Métricas que importam para o seu salão
Body Large19 / 30
weight 400
Organize agenda, finanças e fidelização em um único lugar. Sem planilhas, sem retrabalho — só você no que faz de melhor.
Body15 / 23
weight 400
Acompanhe entradas, despesas e fluxo de caixa em tempo real. A Yoube cuida das contas para você cuidar do salão.
Small13 / 19
weight 400
Aplicado em legendas, captions e textos secundários no produto.
Caps11 / 16
weight 700
tracking +18%
· EYEBROW · CATEGORIA · SEÇÃO
06Fotografia

Duas câmeras. Um olhar.

O modo Bold fotografa a pessoa — frontal, confiante, com cor. O modo Atelier fotografa o ofício — mãos, objetos, gestos. Os dois compartilham os mesmos princípios: gente real, luz natural sempre que possível, sem retoque que desumaniza.

— MODO BOLD Retrato · frontal · luz dura · Iris
— MODO ATELIER Still life · luz natural · paleta morna

Princípios compartilhados

01
Real

Profissionais de verdade, em estúdios reais. Sem cenas montadas, sem atores. Se for ensaio, contrate cabeleireiras, manicures, esteticistas — não modelos genéricos.

02
Diverso

Corpos, idades, tons de pele e segmentos representados na proporção do nosso público. Mulheres trans, plus size, 50+ aparecem com a mesma naturalidade.

03
Próximo

Câmera na altura dos olhos. Pessoa, nunca pose. Gesto, nunca cena. Procure o momento entre dois clichês — o sorriso depois do sorriso ensaiado.

FRONTAL · IRIS
3/4 · ONYX
CLOSE · DEEP
— MODO BOLD · A PESSOA

Retratos diretos. Sem disfarce.

  • EnquadramentoMeio-corpo ou close. Olhar reto na câmera, simétrico.
  • LuzDura ou semi-dura. Sombras marcadas. Pode usar luz colorida (gel roxo).
  • Cor de fundoIris saturado, Onyx ou Iris-deep gradiente. Nunca branco puro.
  • WardrobePeças neutras (preto, off-white) ou com toque de roxo. Sem estampas concorrendo.
  • AtitudeOlhar firme. Nada de sorriso de catálogo — confiança, não simpatia.
— MODO ATELIER · O OFÍCIO

Still life e mãos. O detalhe que ninguém olhava.

  • SujeitoMãos trabalhando, ferramentas, pincéis, esmaltes, pinças, retalhos.
  • LuzNatural sempre que possível. Lateral suave. Janela de manhã ou final de tarde.
  • PaletaTons quentes — Linen, Sand, madeira, terracota. O roxo aparece como um único objeto.
  • ComposiçãoNegativa generosa. Centralizada ou regra dos terços. Nunca apertada.
  • DetalheFoco curto. Grãos de café, fios de cabelo, gotas — micro-textura é convidada.
STILL · FERRAMENTAS
MÃOS · TRABALHO
DETALHE · IRIS

Pós-produção

— Modo Bold
Contraste alto, sombras profundas, roxo vivo.
Contraste · +20 a +30
Sombras · −25 a −40
Saturação · roxo · +10 (canal isolado)
Granulado · 0 a 5
Vinheta · −15 (sutil)
— Modo Atelier
Contraste baixo, granulado fino, tons quentes.
Contraste · −5 a +5
Sombras · +10 a +20 (preservar detalhe)
Temperatura · +200 a +400 K (quente)
Granulado · 15 a 25 (visível)
Saturação geral · −10 (dessaturado)

O que evitar

×
STOCK · GENÉRICO

Não usar banco de imagens genérico. Sempre ensaios próprios.

×

Não retocar pele a ponto de plastificar. Poros, sardas, marcas — ficam.

×
PRODUTO

Não posar segurando o produto/celular como anúncio de catálogo.

×

Não usar fundo preto puro no Atelier. Use Linen, Sand ou madeira.

07Aplicações · Landing page

A mesma marca, em dois ritmos.

A página inicial pode falar Bold (campanha) ou Atelier (institucional / produto). Mude a voz pelo objetivo da página — nunca pela vontade do momento.

Hero · modo Bold CAMPANHA
Yoube
PLATAFORMAPREÇOSDEPOIMENTOS
ENTRAR →

AGENDA.
CAIXA.
CLIENTES.
UM LUGAR.

A plataforma número 1 para profissionais autônomas de beleza. Comece grátis hoje.

COMEÇAR GRÁTIS → Ver demonstração
+12kprofissionais
4,9★avaliação
+34%retorno em 90 dias
Hero · modo Atelier INSTITUCIONAL
Yoube
AtelierDiárioPlataforma
Entrar →
— PLATAFORMA DE BELEZA

Silêncio,
método
e simplicidade.

Sua agenda, sua operação, no ritmo do seu ofício. Comece hoje — leva menos de cinco minutos.

Começar → Demonstração
FOTO · STILL LIFE
08Aplicações · Social media

Feed alterna os ritmos — nunca mistura numa peça só.

Posts Bold trazem manchete, dado ou frase de impacto. Posts Atelier conduzem a leitura, mostram detalhe ou citam. Alterne ao longo da grade para criar fôlego visual.

09Aplicações · Papelaria & brindes

Cartão fala baixo. Tote fala alto.

Peças de mão (cartão, papel timbrado, recibo, agenda impressa) seguem o modo Atelier. Peças de presença pública (tote, camiseta, banner, cartaz, embalagem) seguem o modo Bold.

Yoube
Camila Reis
Atelier de sobrancelhas

camila.yoube.com.br
11 9 9928 · 4421
CARTÃO · 85 × 55mm
Yoube
BELEZA
É OFÍCIO.
TOTE · BRINDE · ALGODÃO CRU
Yoube
AGENDA
CHEIA,
CABEÇA
LEVE.
CARTAZ · A3 · CAMPANHA
10Voz & tom

Bold declara.
Atelier conversa.

A copy muda junto com o visual. Bold é direto, curto e em caixa alta quando precisa. Atelier é caloroso, conduzido e sempre em caixa baixa.

Modo Bold · Voz

AGENDA CHEIA.
CABEÇA LEVE.
ZERO NO-SHOW. FIM.
SUA MARCA
EM UMA URL.

Frases curtas. Caixa alta opcional. Verbos no imperativo. Não tem medo de ponto final. Funciona como manifesto.

Modo Atelier · Voz

Sua semana está organizada. Hoje você atende 6 clientes.
A Yoube confirmou seu agendamento de terça, 14h.
Quer experimentar a Yoube? São 5 minutos.

Frases completas, em caixa baixa. Trata a pessoa como interlocutora — não como público. Dá contexto antes de pedir ação. Usa negrito para guiar o olho.

11Regras · qual modo usar?

Em dúvida? Olhe pela função, não pelo gosto.

A tabela abaixo amarra cada peça ao modo correto. Se uma peça aparece em mais de uma situação (ex.: o e-mail), avalie qual objetivo ela cumpre naquele momento.

Peça / contexto
Modo Bold
Modo Atelier
Landing page
Campanha, lançamento, oferta. Hero declarativo.
Institucional, sobre, página interna, blog.
Anúncio & OOH
Sempre. Tipo é o herói.
—
Social media
Manchetes, dados, slogans, capas de carrossel.
Citações, depoimentos, leituras, diário.
E-mail
Newsletter de campanha, lançamento.
Confirmações, recibos, comunicação transacional.
Produto / app
Apenas no onboarding e tela vazia.
Toda a interface. Padrão do produto.
Papelaria
—
Cartão, papel timbrado, recibo, agenda impressa.
Brindes
Tote, camiseta, caneca, adesivos.
Cadernos, marcadores, embalagens delicadas.
WhatsApp / 1:1
—
Sempre. Voz humana, próxima.
12Não faça

Os erros mais comuns (e como evitá-los).

A maioria dos deslizes vem de misturar os modos numa peça só, suavizar demais o Bold, ou intensificar demais o Atelier.

×
CALMA
E PAZ.

Não use tipografia Bold em fundo Atelier — perde a força.

×
silêncio,
e simplicidade.

Não use Atelier em fundo Onyx — fica frio e sem direção.

×
BOLT · BOTÃO

Não use Bolt em botões. Só em palavras-chave dentro do título.

×

Não invente gradientes coloridos novos. Só roxo monocromático.

Regra de bolso

01
Uma peça, um modo.

Nunca combine os dois ritmos no mesmo cartaz, post ou tela.

02
O roxo aparece sempre.

Em Bold como flood, em Atelier como ponto. Mas nunca está ausente.

03
Tipografia decide a voz.

Peso 800 = grita. Peso 300 = sussurra. Não há meio termo no sistema.