Design System

MFS Industrial Brand

Sistema de diseño y lineamientos visuales utilizados para construir la experiencia digital de MFS Industrial.

Colores

Background

var(--background)

Card

var(--card)

Secondary

var(--secondary)

Muted

var(--muted)

Primary (Brand)

var(--primary)

Foreground

var(--foreground)

Border

var(--border)

Tipografía

Heading 1 (H1) - Bold 4xl/5xl/6xl

Líneas de conformado y corte

Heading 2 (H2) - Bold 3xl/4xl/5xl

Nuestra Propuesta de Valor

Heading 3 (H3) - Bold xl/2xl

Produce más con calidad constante

Body Text - Regular/Medium base/lg

Representamos a fabricantes líderes a nivel mundial. Te acompañamos desde la selección y el dimensionamiento hasta la instalación, puesta en marcha, repuestos y servicio técnico.

Eyebrow / Small Text - Medium/Bold uppercase

Equipamiento Industrial

Componentes UI

Botones

Primary (CTA)

Outline (Secundario)

Tarjetas (Cards)

Soporte Local

Asesoría técnica en cada etapa, repuestos y acompañamiento.

Formularios

Selecciona una opción

Fondos y Texturas

Industrial Grid

Patrón de cuadrícula sutil utilizado para añadir textura técnica a secciones clave sin sobrecargar visualmente.

Glow Radial

Resplandor sutil con el color primario para destacar áreas centrales o componentes importantes.

Tratamiento de Imágenes

Tratamiento Hero
Hero Cinematic Overlay

Gradiente Direccional + Viñeta

Las imágenes principales utilizan un gradiente oscuro de izquierda a derecha (95% a 10% de opacidad) para garantizar una legibilidad perfecta del texto, manteniendo la profundidad industrial y el impacto visual en el lado derecho.

Logotipo

MFS Industrial

Sobre fondo oscuro (Principal)

MFS Industrial

Sobre fondo claro (Alternativo)