Forwork

El lenguaje visual de Forwork.

Forwork utiliza un sistema de identidad simple construido en torno a la claridad, la confianza y señales de trabajo accesibles.

Forwork logo

Una marca clara para un Work Identity claro.

El logotipo Forwork prioriza la legibilidad, el reconocimiento y el uso estable en perfiles, pies de página, superficies PWA, vistas previas de OG y puntos de contacto de trabajo.

Superficie clara Forwork light logo
superficie oscura Forwork dark logo
Marca consciente del tema Forwork theme-aware logo

La marca Forwork más pequeña aún debe ser reconocible al instante.

Los favicons y los íconos de aplicaciones aparecen en pestañas del navegador, accesos directos, superficies PWA, pantallas de inicio y pequeños contextos donde el logotipo completo ya no tiene suficiente espacio.

SVG predeterminado
Forwork favicon SVG

favicon.svg

Modo de luz
Forwork light favicon

favicon-light.svg

modo oscuro
Forwork dark favicon

favicon-dark.svg

Apple touch
Forwork Apple touch icon

apple-touch-icon.png

PWA 192
Forwork PWA 192 icon

pwa-192x192.png

Maskable 512
Forwork maskable PWA icon

maskable-icon-512x512.png

Woan es la guía dentro de Forwork.

Woan ayuda a que Forwork se sienta menos como una herramienta de perfil frío y más como un espacio amigable donde las personas pueden explicar su trabajo con claridad.

Identity Core mascot

Identity

Ayuda a los espectadores a descubrir quién eres rápidamente.

Proof Core mascot

Proof

Guía a los espectadores hacia pruebas reales.

Thinking Core mascot

Thinking

Hace que el pensamiento práctico sea más fácil de ver.

Contact Core mascot

Contact

Hace que el siguiente paso parezca más claro.

El color se utiliza para guiar la atención, no para decorar todas las superficies.

Forwork Accent

#1800AD · #A99CFF dark

Vínculos, acciones clave y aspectos destacados de la identidad.

Ink

#191919

Texto sólido, títulos y anclajes legibles.

Paper

#FFFFFF

Superficies de lectura limpias, tranquilas y concentradas.

Soft Surface

#F1F1EF

Etiquetas, tarjetas y jerarquía silenciosa similares a nociones.

La tipografía Forwork debe parecer clara, compacta y accesible.

Forwork utiliza Manrope como tipo de letra principal en las páginas de destino, UI y texto de marca. Si Manrope no se puede cargar, las fuentes del sistema mantienen la experiencia rápida y legible.

tipo de letra principal Manrope

Aa Bb Cc · 1234567890

Uso
rumbo

Espacio entre letras atrevido, conciso y ligeramente ajustado para una sensación moderna y segura.

cuerpo

Legible, con una altura de línea cómoda y centrado en la claridad sobre la decoración.

Etiquetas pequeñas

Utilice suficiente peso para metadatos, etiquetas, botones y navegación.

El nombre debe ser tan consistente como el logotipo.

Forwork es el nombre oficial. 4Work y 4W son formas abreviadas de contexto de ecosistema, UI ajustado o referencias más informales.

Nombre oficial Forwork

Úselo para páginas de destino, SEO, OG, encabezados, texto de marca y puntos de contacto oficiales.

Nombre del ecosistema 4Work

Úselo cuando se refiera a 4Tips, ProfileKit o productos que pertenecen al mismo ecosistema.

forma corta 4W

Funciona para insignias, etiquetas cortas, menús ajustados o contexto interno. Evite usarlo como título principal SEO.

uso

Forwork para contenido oficial.

4Work para el contexto del ecosistema.

4W cuando el espacio UI es muy reducido.

evitar

ForWork porque las mayúsculas están mal.

FourWork porque diluye el reconocimiento.

4work excepto en URL o código.

Cada elemento visual respalda una idea: hacer que el trabajo sea más fácil de entender.

Borrar

La tipografía, el espaciado y el diseño reducen las conjeturas.

humano

Woan hace que el producto sea más amigable sin perder profesionalismo.

digno de confianza

Las marcas consistentes y los colores sobrios hacen que los perfiles se sientan estables.

Conectado

Forwork, 4Tips y ProfileKit pertenecen a un ecosistema conectado.

Utilice la identidad con suficiente espacio para respirar.

No estire ni cambie el color del logotipo al azar.

Utilice Woan para explicar, guiar o presentar una idea de producto.

Utilice colores de acento intencionalmente y priorice la claridad sobre la decoración.