// 01 · la idea
Un gato negro sentado adentro de una llave.
Un gato negro, entero, sentado derecho y de perfil, mirando hacia adelante. Parece un gato cualquiera hasta que se ven los dos detalles que lo hacen de una casa que escribe software.
- 1
La cola es una llave
La
{con la que empieza todo bloque de código. Va de la altura de la oreja hasta el piso, dobla y se hace piso: el gato se sienta sobre su propia cola, adentro de lo que hacemos. Tiene el mismo grosor que las letras del nombre: el gato y la palabra salen de la misma lapicera. - 2
El ojo es un cursor
De noche, de un gato negro se ven los ojos. El nuestro es una cápsula dorada parada, como el cursor que titila cuando alguien está por escribir. En pantalla, titila. Y es el mismo dorado que el punto de la i.
- 3
Se sienta derecho y mira adelante
Atento, tranquilo y curioso. No salta, no ataca, no hace monerías: está esperando que le cuenten el problema. Así queremos que nos vean los clientes.
Software que cae parado.
Los gatos caen siempre de pie. Es lo que le pedimos a lo que hacemos: que cuando algo sale mal, aguante y siga andando. Es la frase de la casa y va con el logo cuando hay lugar.
// 02 · no es el de GitHub
Nada de una cabeza de frente adentro de un círculo.
La mascota de GitHub es una cabeza de gato vista de frente y metida en un círculo. Ese terreno ya tiene dueño. El nuestro está dibujado para no pisarlo, y cuatro reglas lo mantienen lejos.
- De perfil, nunca de frente.El gato mira hacia la derecha, hacia adelante. Nunca a cámara.
- Entero y sentado, nunca sólo la cabeza.La marca es el cuerpo completo. Recortar la cabeza sola lo acerca al otro.
- Sin marco.Ni círculo, ni escudo, ni insignia. Si una red recorta el avatar en redondo, adentro va el gato entero, chico, sobre dorado.
- Con la llave y el ojo dorado.Sin la cola en llave y sin el cursor, es otro gato negro más.
// 03 · el símbolo
El gato, medido.
Se dibuja sobre una caja de 100 unidades con el piso en 96. Dos piezas: la silueta, que es el gato con su cola, y el ojo. El dibujo salió de una ronda con un generador de imágenes; se calcó y se pasó a curvas. Las medidas de abajo son las del archivo; no se redibuja a mano.
1,5, la misma altura que el gancho de la llave.3,4 × 7,9Parada, como un cursor. Dorada sobre el gato, o calada cuando la pieza va en un solo color.7,7, puntas redondasA la escala del logo horizontal, ese trazo mide lo mismo que el de las letras.48,75: la punta de la { mira hacia afuera, lejos del cuerpo.El ojo titila como un cursor
En pantalla, el ojo se apaga y se prende al ritmo de un cursor de texto: 530 ms prendido, 530 apagado. Se usa en la portada de la web, en una pantalla de carga o en un video; nunca en un documento ni en un ícono. Y se detiene solo: parpadea unas veces y se queda mirando.
// 04 · la palabra
torbits, en minúscula y con un solo trazo.
La palabra está dibujada, no escrita con una tipografía: siete letras geométricas con el mismo grosor en todas partes, puntas redondas y el punto de la i convertido en el cursor del gato.
50 · trazo: 10,5El trazo es el 21 % de la altura x. Es la unidad de toda la marca: la cola del gato y los íconos de línea salen de ahí.10,5 × 15,75, dorado. Es el mismo ojo del gato puesto en la palabra.35 y la b a 27. El pie de la t se curva hacia adelante, como la punta de la cola.En el logo, torbits va siempre en minúscula. En un texto corrido se escribe Torbits, con mayúscula, como cualquier nombre propio.
// 05 · versiones
Cuatro formas, una para cada lugar.
La principal es la horizontal. Las otras tres existen para cuando el espacio no la deja respirar, no para variar.
Horizontal
La principal. Encabezados de la web, documentos, propuestas, firmas, presentaciones. Si hay duda, va ésta.
Vertical
Cuando el lugar es cuadrado o alto: portadas, carteles, remeras, el frente de una tarjeta.
Símbolo
Cuando el nombre ya está dicho o no entra: favicon, avatar, ícono de app, el sello en el pie de una página.
Palabra
Cuando el gato ya aparece en otro lugar de la misma pieza, o donde es tan chico que el gato no se lee.
// sobre cada fondo
En las versiones de un color el ojo no se pinta: se cala, y por el agujero se ve el fondo. Por eso sirven para sellos, bordados y vinilo.
// 06 · aire y tamaño mínimo
Lo que el gato necesita alrededor.
La medida del aire sale del mismo logo: x, la altura de la o. Nada entra en esa franja, ni texto, ni otra marca, ni el borde de la hoja.
// 07 · lo que no se hace
Ocho maneras de romperlo.
Todas pasaron alguna vez en alguna marca. Si una pieza necesita algo de esta lista para funcionar, el problema es la pieza.
Y uno que no entra en un cuadrito: ponerlo sobre una foto o un fondo con dibujo sin una franja lisa detrás. Si el fondo compite, el gato pierde.
// 08 · color
Tres colores: el gato, el ojo y la leche.
La marca es negra y clara, y tiene una sola cosa dorada por pieza. El dorado es poco a propósito: es lo primero que se ve, como los ojos de un gato negro a la noche.
Gato
- RGB
- 21 20 26
- CMYK
- 60 50 40 100 (fondos) · K100 (texto)
- Pantone
- Black 6 C
El negro de la marca. Tiene un dejo violeta, como el brillo del pelo: nunca negro puro #000.
Ojo
- RGB
- 245 178 42
- CMYK
- 0 30 90 0
- Pantone
- 7409 C (aprox.)
El dorado. Ojo, cursor, un botón, un número. Sobre claro nunca va como texto: no se lee.
Leche
- RGB
- 244 243 239
- CMYK
- 3 2 5 0 · o papel natural
- Pantone
- —
El fondo claro. Casi blanco, apenas tibio, para que el negro no encandile en pantalla.
La regla del ojo: el dorado ocupa menos que el negro, y el negro menos que el fondo. Vale igual al revés, con el negro de fondo.
// neutros
superficie sobre Gato
líneas sobre Gato
texto 2 sobre claro
deshabilitado
texto 2 sobre Gato
líneas sobre claro
// el dorado cuando no puede ser dorado
dorado como texto o enlace sobre claro
resaltador de fondo
// estados · sólo productos y datos
Cada estado tiene su tono para fondo claro y para fondo oscuro. El aviso es naranja y no dorado a propósito: el dorado es de la marca y no puede significar «cuidado».
// qué texto va sobre qué fondo
| par | contraste | uso |
|---|---|---|
| Gato / Leche | 16,5 : 1 | ✓ cualquier texto |
| Leche / Gato | 16,5 : 1 | ✓ cualquier texto |
| Gato / Ojo | 9,8 : 1 | ✓ botones y rótulos |
| Ojo / Gato | 9,8 : 1 | ✓ cifras y enlaces en oscuro |
| Humo / Leche | 5,9 : 1 | ✓ texto secundario |
| Ámbar / Leche | 5,0 : 1 | ✓ enlaces en claro |
| Bruma / Gato | 7,6 : 1 | ✓ texto secundario en oscuro |
| Ceniza / Leche | 3,0 : 1 | solo 24 px o más |
| Ojo / Leche | 1,7 : 1 | ✕ nunca texto |
// 09 · tipografía
Tres familias, tres trabajos.
Las tres son libres (licencia SIL OFL): se usan gratis en la web, en documentos, en apps y en impresos. Se bajan de Google Fonts. El logo no se escribe con ninguna: la palabra está dibujada.
Bricolaje: armar con lo que hay, en el taller. Tiene carácter sin gritar. Para titulares, portadas y números grandes, con la interletra apretada; nunca para párrafos.
700 · 800Clara y amable, con redondos geométricos como los de la palabra. Para todo lo que se lee de corrido: la web, las propuestas, los mails, la interfaz.
400 · 500 · 600 · 700Lo que tiene que ser exacto va en mono: precios, horas, fechas, código, rótulos. Los rótulos empiezan con //, como un comentario.
// escala
| rol | familia · peso | tamaño / interlínea | muestra |
|---|---|---|---|
| Título 1 | Bricolage 800 | 56 / 1,0 · −3 % | Cae parado |
| Título 2 | Bricolage 800 | 40 / 1,05 · −2,5 % | Cómo trabajamos |
| Título 3 | Bricolage 700 | 24 / 1,15 · −1 % | Precio cerrado |
| Bajada | Figtree 400 | 20 / 1,45 | Antes de empezar sabés cuánto sale. |
| Texto | Figtree 400 | 17 / 1,55 | Te mostramos las horas a medida que las cargamos. |
| Chico | Figtree 500 | 14 / 1,45 | Actualizado el 28 de septiembre |
| Rótulo | JetBrains Mono 500 | 12,5 / 1,3 | // 03 · el símbolo |
| Cifra | JetBrains Mono 500 | tabular | 60 h · 6 semanas |
Donde no se pueden cargar fuentes (un mail, una planilla), se usa la del sistema: ui-sans-serif, system-ui para todo y ui-monospace para lo exacto. El logo va siempre como imagen.
// 10 · elementos
Lo que acompaña al gato.
Cuatro piezas chicas que salen del logo y se usan en todo lo demás. Con éstas y el color alcanza para que una pieza sea de Torbits aunque el gato no aparezca.
La llave
Enmarca lo que importa: una cifra, una frase, una promesa. Se dibuja con el trazo de la marca y va en dorado sobre oscuro o en ámbar sobre claro. Una por pieza.
- Precio cerrado antes de empezar
- Las horas, a la vista
- Entregas cada dos semanas
El cursor
La barrita dorada del ojo. Marca «acá» y «lo que sigue»: viñetas, la sección donde estás, algo que se está cargando. Titila sólo cuando algo espera.
El trazo
Íconos de línea: grilla de 24, trazo de 2, puntas y uniones redondas, sin rellenos. Es la cola del gato en chico. Para lo que no está dibujado, Lucide (lucide.dev) usa el mismo trazo.
// propuesta P-012
Turnos online
// 60 h · 6 semanas
El comentario
Los rótulos se escriben en mono, en minúscula y empezando con //, como un comentario en el código. Van arriba de los títulos y al pie de las figuras.
// el gato en otras poses
Sentado
Es el logo. No se usa como ilustración.
Asomado
Para saludar o para la página que no existe.
Dormido
Para lo vacío: «no hay nada por acá».
Caminando
Se va con la cola en }: cierra la llave. Para lo terminado.
Las poses son ilustraciones: nunca reemplazan al logo y nunca llevan la palabra al lado.
// 11 · voz
Hablamos como el gato: poco, claro y mirando a los ojos.
Una empresa chica que le escribe software a otra empresa chica. Sin humo, con números, en castellano de acá.
De vos, y en castellano de acá
Hablamos como hablamos: «contanos», «fijate», «te lo mandamos». Ni usted, ni tú, ni inglés de oficina cuando hay palabra propia.
Con números
Cuánto sale, cuánto tarda, cuántas horas van. Un número dice más que tres adjetivos y es más fácil de creer.
Sin humo
Nada de «soluciones disruptivas», «sinergia» ni «transformación digital». Si no se lo diríamos a un vecino, no va.
Un guiño, no un chiste
El gato aparece de vez en cuando. No todo necesita un juego de palabras con gatos; uno por pieza, como el dorado.
// así sí · así no
| así sí | así no |
|---|---|
| Son 60 horas, y el precio queda cerrado antes de empezar. | Ofrecemos soluciones escalables adaptadas a tu presupuesto. |
| Tus turnos online, en seis semanas. | Transformamos digitalmente tu negocio. |
| Contanos qué te complica. | Agendá una consultoría estratégica. |
| Esta semana hicimos la pantalla de pagos. Falta probarla con tarjetas reales. | El proyecto avanza según lo planificado. |
| Encontramos un error en los pagos. Ya está arreglado y te contamos qué pasó. | Se detectó una incidencia que fue oportunamente resuelta. |
// frases de la casa
Software que cae parado.la principal · con el logo
Software a medida, hecho en casa.para decir qué hacemos
Abrimos la llave. La cerramos cuando anda.para decir cómo trabajamos
// 12 · aplicaciones
El gato, puesto a trabajar.
Cómo se ve la marca en las piezas que Torbits usa para conseguir y atender clientes. Los textos y los nombres de clientes son ejemplos.
La web
torbits.ar · portadaTarjeta personal
85 × 55 mmPortada de propuesta
A4// propuesta · ejemplo
Turnos online para el consultorio
Que los pacientes saquen, cambien y cancelen turnos desde el teléfono, y que la agenda del consultorio se llene sola.
Consultorio Belgrano
Redes
avatar · publicaciones · portadasoftware a medida
¿Tu negocio vive en un Excel que ya no da más?
Firma de correo
texto + símbolo en PNGTe mando la propuesta con las horas por etapa. Cualquier duda, me escribís.
Favicon e ícono
pestaña · pantalla de inicio
Torbits · software a medida
TorbitsMúsicaAjustes
El sello
en el pie de lo que hacemos<a href="https://torbits.ar" class="hecho-por-torbits"> <img src="torbits-simbolo-negro.svg" alt="" height="17"> hecho por torbits </a>
Mono de 12 px, color Humo, y el símbolo de un color a 17 px. Sólo si el cliente está de acuerdo.
Calcos
troquelado con borde blanco// 13 · la casa y sus productos
Torbits firma; cada producto tiene nombre propio.
El gato es de la casa, no de cada cosa que la casa hace. Los productos llevan su nombre y su color, y el gato aparece chico, como sello.
Lo que hacemos para clientes
La marca es del cliente. Nosotros vamos en el sello del pie, si el cliente quiere, y en la portada de la propuesta.
Taller, Toque y los que vengan
Cada uno con su nombre y su color; Taller conserva su verde. No usan el gato como logo: lo llevan en el sello «de torbits».
Cada juego, su caja
Cada juego tiene su propia gráfica. En la caja, el gato firma en un lateral y en el reglamento, con «torbits juegos».
// 14 · archivos
Todo lo que hay, y de dónde sale.
Los archivos viven en docs/marca/. Ninguno se edita a mano: salen de generar.py, que dibuja todo desde las mismas medidas.
| pieza | archivos | para qué |
|---|---|---|
| Horizontal | la principal | |
| Vertical | portadas, tarjetas | |
| Símbolo | sello, firma | |
| Palabra | con el gato en otro lado | |
| Contornos | vinilo, bordado, imprenta: sin trazos | |
| Íconos | web y apps | |
| Redes | perfiles y vista previa de enlaces | |
| Poses | ilustración | |
| Colores y letras | variables CSS, claro y oscuro |
Si se cambia una medida o un color, se cambia en generar.py y se corre de nuevo: rehace los SVG, los PNG, tokens.css y los dibujos de este manual.