// bm-sections-2.jsx — Lockups, Cor no logo, Usos (do/don't), Paleta, Tipografia.
// Exports: SecLockups, SecLogoColor, SecDosDonts, SecPalette, SecType.
function SecLockups() {
const Box = ({ label, children, dark, span }) => (
{label}
{children}
);
return (
O ponto ciano aparece somente no lockup horizontal, como separador entre o símbolo e o nome. Ele não é parte do logo — não use no empilhado, no tagline, nem dentro do símbolo. É um detalhe de pontuação, não um elemento.
);
}
function SecLogoColor() {
const Chip = ({ mode, label, desc, bg, dark }) => (
{label}
{desc}
);
const Bg = ({ bg, mode, label, ok }) => (
);
return (
Sobre quais fundos cada versão funciona
Sobre cores sólidas e quentes da marca (coral, âmbar), use sempre a versão mono em ink. O logo colorido tem coral nos acentos — coral sobre coral desaparece. Foi por isso que a diagonal do N e o i sumiam.
);
}
function SecDosDonts() {
const Dont = ({ caption, children }) => (
✕
{children}
{caption}
);
return (
);
}
function SecPalette() {
const Sw = ({ hex, name, role, fg = T.ink, ring, big }) => (
{name}
{hex}
{role &&
{role}
}
);
const Group = ({ title, children, dark }) => (
);
return (
Modo claro
Proporção de uso
60% neutro · 30% quente · 10% ciano. O frio é tempero, não base.
Use o ciano só onde quer puxar o olho: um link, um estado ativo, o separador do logo, um dado-chave. Se tudo é ciano, nada é. É o único frio numa marca quente — esse contraste é a assinatura.
);
}
function SecType() {
const Spec = ({ fam, font, role, sample = "Ag", style, color = T.ink }) => (
{sample}
{fam}
{role}
);
const Scale = ({ name, px, weight, font = F.display, ls = "-0.5px", style }) => (
{name}
Nicolas Lima
{px}px · {weight}
);
return (
Escala e hierarquia
Bricolage só em tamanhos grandes e pesos altos (700–800) — ela foi feita pra brilhar em título. Hanken para tudo que se lê em parágrafo. IBM Plex Mono só em labels, código e dados — em caixa alta com espaçamento, vira o "carimbo técnico" da marca.
);
}
Object.assign(window, { SecLockups, SecLogoColor, SecDosDonts, SecPalette, SecType });