Browse commands

/impeccable bolder

Bolder

Empuja los diseños seguros hacia el impacto sin caer en el caos.

Cuándo usarlo

Recurre a /impeccable bolder cuando la interfaz parece cualquier otra interfaz. Sans genérica, pesos medios, sombras suaves, color de acento modesto, espaciado razonable, olvidable. El diseño no está mal, simplemente es seguro. Usa bolder cuando un proyecto puede permitirse presencia y el estado actual no aporta ninguna.

No lo uses en paneles de control que la gente mira durante horas. La audacia gana su lugar en páginas de marketing, momentos hero y elementos de contenido. No en herramientas de operador.

Cómo funciona

La habilidad amplifica cuatro ejes sin romper la usabilidad:

  1. Escala: la tipografía display se empuja a clamp(3rem, 6vw, 6rem) o más allá. Titulares que llenan el viewport, no que lo esquiven.
  2. Contraste de pesos: peso ligero 300 contra pesado 800 en lugar de medio contra regular. Tensión real, no un encogimiento de hombros.
  3. Compromiso cromático: el color de acento aparece a máxima intensidad, no diluido. Los fondos pueden tomar una postura (tinta, acento, crema) en lugar de todo en papel.
  4. Confianza compositiva: asimetría, fuera de cuadrícula, citas destacadas, comillas colgantes, saltos de escala. El diseño tiene voz.

La habilidad no añade más. Amplifica lo que ya está ahí. Si el diseño tiene tres colores, bolder no añade un cuarto, se compromete más con los tres.

Pruébalo

/impeccable bolder the landing page hero

Cambios esperados:

  • Encabezado hero de 3rem a clamp(3.5rem, 7vw, 6.5rem), fuente display, peso 700
  • Subencabezado de regular a cursiva a 1.5rem, desplazado 8px a la izquierda del encabezado para alineación óptica
  • El fondo pasa de papel a un degradado crema-a-papel, creando un contenedor más cálido
  • El botón CTA se rellena, se elimina la sombra paralela, se reduce el radio del borde, el estado hover invierte los colores
  • La imagen de apoyo se empuja ligeramente fuera de la cuadrícula con un margen superior negativo, creando asimetría

Errores comunes

  • Ejecutarlo en la página equivocada. Los paneles de producto, configuraciones y formularios no deberían ser audaces. Deberían ser legibles. Usa /impeccable layout o /impeccable polish en su lugar.
  • Confundir audaz con ruidoso. Audaz significa comprometido y confiado. Ruidoso significa gritar. Bolder es lo primero. Si el resultado se siente agresivo, continúa con /impeccable quieter.
  • Combinarlo con /impeccable delight en la misma pasada. Delight funciona mejor sobre una base visual estable. Primero audacia, luego estabiliza, luego delight.