Correcto
Ajustes de color del banner
Personalice los colores, degradados y superposiciones del banner para un contenido de banner más claro y distintivo.
Use este grupo de ajustes para dar a los contenidos basados en banners su propia combinación de colores sin cambiar el resto de la paleta de su tema. Estos controles sustituyen los colores predeterminados del tema para los banners, por lo que son útiles para promociones, anuncios, contenido principal y otras áreas que necesitan un aspecto más distintivo. Para saber dónde se ajustan estos ajustes, consulte documentación de Shopify sobre el editor de temas. Para obtener una visión general más amplia de cómo se construyen las áreas de banner, consulte documentación de Shopify sobre secciones y bloques
Colores del banner
Sección titulada «Colores del banner»Los principales controles de color definen la superficie del banner y el contenido que se muestra en él. Puede configurar el aspecto general con colores de fondo y de borde, y después refinar la jerarquía del contenido con colores separados para encabezados, subtítulos, texto e iconos.
Para obtener el resultado más limpio, elija primero el fondo y el color principal del texto. El color del texto del banner actúa como color de respaldo para el contenido de texto del banner cuando no se aplica un color de texto más específico, por lo que es el mejor punto de partida para establecer un contraste legible.
Construya los colores del banner como un conjunto, no un ajuste a la vez. Si el fondo, el texto, los iconos y los bordes no comparten un patrón de contraste claro, el banner puede resultar más difícil de leer y menos intencional.
Degradados y profundidad visual
Sección titulada «Degradados y profundidad visual»Puede añadir un degradado al fondo del banner cuando un color plano parezca demasiado simple o pesado. Esto funciona bien para banners que necesitan más profundidad visual sin depender de imágenes adicionales.
Por lo general, un degradado sutil resulta más pulido que uno llamativo. Si el banner ya incluye texto destacado, imágenes potentes o varias capas de contenido, mantener el degradado contenido ayuda a que el mensaje siga siendo el foco.
Superposición y opacidad
Sección titulada «Superposición y opacidad»Los controles de superposición añaden una capa tintada sobre el área del banner, lo que puede ayudar a separar el texto del fondo. Esto es especialmente útil cuando el contenido del banner se sitúa sobre imágenes u otras superficies visualmente recargadas.
Los controles de opacidad de la superposición determinan cuán visible se vuelve esa capa. Un ajuste de 0% hace que la superposición sea totalmente transparente, mientras que el ajuste de respaldo usa la opacidad ya definida en los ajustes principales de color. Ese respaldo es útil cuando desea que las superposiciones del banner se mantengan alineadas con el estilo general de su sitio.
Bordes, iconos y detalles de apoyo
Sección titulada «Bordes, iconos y detalles de apoyo»Los colores de borde e icono ayudan a completar el estilo del banner, pero funcionan mejor como acentos de apoyo. Si están demasiado cerca del fondo, pueden desaparecer. Si son mucho más intensos que el texto, pueden distraer del mensaje principal.
Un buen enfoque es mantener los bordes sutiles y usar el color del icono para apoyar la jerarquía del contenido. Deje que los encabezados y las acciones principales asuman la mayor parte del énfasis visual, salvo que el banner esté pensado para que el icono sea el elemento principal.
Notas de uso
Sección titulada «Notas de uso»- Empiece por el contraste. Establezca primero el fondo y el color principal del texto para que todos los demás colores del banner puedan ajustarse sobre una base legible.
- Use los degradados con moderación. Mantenga los degradados sutiles cuando los banners ya incluyan imágenes potentes, tipografía destacada o varias capas de contenido.
- Ajuste las superposiciones antes de reescribir la paleta. Una superposición más fuerte suele mejorar la claridad del texto más rápido que cambiar varios colores de texto y acento.
- Mantenga los acentos en segundo plano. Los colores de borde e icono deben reforzar el estilo del banner sin convertirse en el foco principal.
- Use los valores de respaldo con intención. Los valores en blanco, transparentes o con estilo predeterminado suelen conservar el estilo del banner circundante, mientras que los colores y degradados explícitos hacen que el área del banner se sienta más independiente.