Renó
Cómo se dibuja Renó: el isologo, los cuatro colores y las reglas que hacen que una pieza se reconozca sin leer el nombre.
01
El isologo son dos piezas que funcionan juntas o por separado según la aplicación: la R sobre la tarjeta verde, y el logotipo Renó. La tarjeta no es decorativa — es la señal de rendimiento, la misma que se muestra en cancha.
Lockup horizontal
El uso por defecto. Es el que va en cabeceras, mails y previews sociales.
Isologo suelto
Cuando el nombre ya está escrito al lado, o el espacio es cuadrado.
Logotipo suelto
Sin el isologo. Para pies de página y créditos, donde la marca ya se presentó arriba.
02
Dos variantes monocromas para cuando el color no está disponible: sellos, bordados, una sola tinta, o un fondo que ya tiene demasiado color propio.
Negativo — blanco sobre oscuro
Sobre carbón, negro o una foto oscura y sin ruido.
Positivo — negro sobre claro
Sobre blanco o un gris muy claro. Nunca sobre el verde de marca.
03
En todos los casos manda la legibilidad del isologo. La regla corta: sobre fondo oscuro va el reverse, sobre fondo claro va el primario, y sobre el verde de marca va el monocromo — nunca el isologo a color, porque la tarjeta desaparecería contra el fondo.
Sobre carbón
Correcto — reverse.
Sobre blanco
Correcto — primario.
Sobre verde de marca
Correcto — monocromo blanco. El isologo a color acá se pierde.
Sobre gradiente
Reverse, y sólo si el extremo más claro sigue siendo oscuro.
04
Alrededor del isologo queda un aire libre de x, donde x es el ancho de la tarjeta verde. Nada entra ahí: ni texto, ni bordes, ni otro logo. Es una medida relativa a propósito — escala sola con el logo y no hay que recalcularla por tamaño.
Tamaño mínimo
El isologo no baja de 24 px de alto en pantalla. Por debajo, el contra de la R se cierra y la tarjeta se lee como un cuadrado.
No deformar
Se escala proporcional. Nunca estirado, inclinado ni con sombra propia.
No recolorear
La tarjeta es verde de marca o es monocroma. No hay una tercera opción.
No sobre foto cargada
Si el fondo tiene detalle detrás del logo, va una placa sólida abajo.
05
Cuatro colores. Un negro profundo que aporta estructura, dos verdes que son la señal de marca, y el blanco que sostiene la legibilidad. El verde se reserva para lo que se quiere destacar: si todo es verde, nada lo es.
Negro profundo. Estructura y solidez: es el fondo por defecto de la marca, no un color de texto.
No es #000. El negro puro sobre pantalla vibra contra el verde y aplana el isologo.
El verde luminoso. Se reserva para lo que se quiere destacar: CTAs, foco, estados activos.
El verde exacto de la tarjeta del isologo. Es el que manda sobre fondo claro, donde el señal se lava.
El manual imprime #02bb3d; el vector dibuja #03bb3f. Vale el vector — es lo que se ve en pantalla.
Aire y contratipo. Sostiene la legibilidad del isologo en negativo.
El manual entrega dos verdes, y con dos verdes no se arma una interfaz — no alcanzan para un hover, un borde, un fondo de badge y un texto que pase contraste. Estos once pasos se construyeron alrededor del 600 del isologo, que es el único valor que no se movió. Los dos oficiales van marcados.
50
#effaf3
100
#daf6e3
200
#b6f1ca
300
#83eca6
400
#3cec77
500●
#0bda4d
600●
#03bb3f
700
#069335
800
#0b6f2e
900
#0d4a23
950
#0b2817
06
El manual no define ninguno — son nuestros. La regla que se respeta es la suya: un gradiente sale sólo de los cuatro colores oficiales y de la escala construida sobre ellos, nunca de un color nuevo metido para que la transición «cierre» mejor.
Marca
--reno-gradient-brand
.reno-surface-brand
Carbón → Verde 800 → Verde 600
El gradiente firma. Bloques de identidad, headers de sección grande, la portada de esta página.
Verde
--reno-gradient-green
.reno-surface-green
Verde 400 → Verde 600
Botones primarios y cualquier superficie chica que tenga que leerse como acción.
Verde profundo
--reno-gradient-green-deep
.reno-surface-green-deep
Verde 500 → Verde 900
Bandas grandes de cierre —el CTA del pie— donde el verde pleno cansaría.
Carbón
--reno-gradient-carbon
.reno-surface-carbon
Carbón → Negro
Superficies neutras que necesitan profundidad sin sumar color.
Para texto hay .reno-text-gradient, que recorta el gradiente contra las letras. Invierte solo en tema claro — sobre blanco arranca en carbón, porque un título que empieza en verde ya perdió el contraste en la primera palabra.
07
El manual especifica Paralucent Medium para las piezas de identidad. Es una fuente comercial y no viene en el paquete, así que la web no puede servirla: el sitio usa Inter para texto y Barlow Condensed para los display. Está anotado acá y no escondido, porque una pieza hecha con la fuente equivocada se nota más tarde y cuesta más.
Identidad · impresos
ABCDEFGHIJKL
MNOPQRSTUV
WXYZ1234567890
Muestra tal como la lista el manual. Se representa en monoespaciada porque no tenemos la licencia — dibujar el espécimen con otra fuente y llamarlo Paralucent sería peor que no mostrarlo.
Web · producto
Barlow Condensed — display
Rendimiento
Inter — texto corrido
Mucho más que resultados. Cada métrica se lee sin depender de una interpretación técnica.
08
Los vectores que usa este sitio, servidos tal cual. Para imprenta pedí el paquete completo — trae los .ai en CMYK, que es lo que necesita una gráfica y no sirve en pantalla.
¿Necesitás una variante que no está acá, o querés usar la marca en una pieza propia? Escribinos a lufbenitez@gmail.com. Si venís del lado comercial, la página de sponsors tiene el contexto de cómo se usa la marca en conjunto.