Framework
Dipe Global Presets UI Style Guide
01. Paleta de color
En esta parte de la guía de estilo, puedes modificar cada color dentro de la configuración de fondo del módulo de texto. Usa ese mismo código de color dentro del módulo de texto que se encuentra debajo para tener también una versión escrita del código de color. Usa estos códigos de color dentro de la paleta de colores predeterminada.
#FFFFFF
#F9F9F9
#f2f2f2
#e0e0e0
#444444
#000000
Muted colors
#F2B544
#595959
#F2D49B
#F2E4C9
#F2F2F2
#000000
Colorful Complementary.
#9BC1F2
#B3AC9F
#F2D49B
#828E9D
#73654C
#000000
Colorful Shades
#CFB584
#A6916A
#F2D49B
#7D6D50
#544A36
#000000
#F9F9F9
#e0e0e0
#444444
#000000
02. Text styles
En la segunda parte de este wireframe de guía de estilo, puedes diseñar diferentes tipos de texto. También se te proporciona una opción principal, secundaria y terciaria, cada una de las cuales puedes convertir posteriormente en ajustes preestablecidos individuales.
Primary
Secondary
Tertiary
Heading 1
Heading 1
Heading 1
Heading 1
Heading 1
Heading 1
Heading 1
Heading 2
Heading 2
Heading 2
Heading 2
Heading 3
Heading 3
Heading 3
Heading 3
Heading 4
Heading 4
Heading 4
Heading 4
Body
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Box Enfasis
Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor .
- lista
- lista
Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor .
- lista
- lista
Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor .
- lista
- lista
List
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
All in one
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Lorum ipsum dolor sit amet.
- Lorum Ipsum
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Lorum ipsum dolor sit amet.
- Lorum Ipsum
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Lorum ipsum dolor sit amet.
- Lorum Ipsum
03. Modules
La última parte de esta guía de estilo se ocupa de algunos de los módulos más utilizados en Divi. Aquí también te ofrecemos una versión primaria, secundaria y terciaria de cada módulo, que puedes diseñar y agregar como un ajuste preestablecido global.
Primary
Secondary
Tertiary
Button
Blurb
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Email optin
Contact form
Image
Call to action
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Divider
Person
Name Goes Here
Position
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Name Goes Here
Position
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Name Goes Here
Position
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Social Media Follow
Toggle
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Testimonial
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Video
Accordion
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Blog
El poder de la vulnerabilidad
La diferencia entre un proceso de coaching y un proceso de mentoría. Esta es una duda muy común, por lo que quiero hablar un poco sobre las diferencias entre ambas metodologías de acompañamiento.
Procesos de Acompañamiento
La diferencia entre un proceso de coaching y un proceso de mentoría. Esta es una duda muy común, por lo que quiero hablar un poco sobre las diferencias entre ambas metodologías de acompañamiento.
Santa Claus is coming to town: una oportunidad de resiliencia.
Las fiestas de esta temporada, el tiempo en familia o lejos de la familia -como es mi caso-, la introspección que puede llevar pegada el fin de año y la definición de metas para el siguiente, pueden hacer de esta época un tiempo retador y emocionalmente desafiante.
Te deseo una relación sabia con tu realidad.
Las fiestas de esta temporada, el tiempo en familia o lejos de la familia -como es mi caso-, la introspección que puede llevar pegada el fin de año y la definición de metas para el siguiente, pueden hacer de esta época un tiempo retador y emocionalmente desafiante.
La necesidad de reinventarnos
Cuando llevamos muchos años en la misma práctica, cuando nos volvemos “expertos” exitosos en nuestra materia, de manera natural empezaremos a poner el foco de nuestra atención en aquellos hechos que validan lo que hasta ahora nos ha funcionado
El coaching… ¿qué es?
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Mente de principiante
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Solución Creativa de Problemas
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Nuestro sistema de creencias y nuestras emociones
Las emociones -por suerte para todos-, ahora forman parte de nuestro lenguaje de una forma más abierta. En las organizaciones hace ya algunos años que empezamos a hablar de ellas e incluso a formar a los colaboradores sobre el tema de la Inteligencia Emocional (¡gracias, Daniel Goleman!)
El poder de la vulnerabilidad
La diferencia entre un proceso de coaching y un proceso de mentoría. Esta es una duda muy común, por lo que quiero hablar un poco sobre las diferencias entre ambas metodologías de acompañamiento.
Procesos de Acompañamiento
La diferencia entre un proceso de coaching y un proceso de mentoría. Esta es una duda muy común, por lo que quiero hablar un poco sobre las diferencias entre ambas metodologías de acompañamiento.
Santa Claus is coming to town: una oportunidad de resiliencia.
Las fiestas de esta temporada, el tiempo en familia o lejos de la familia -como es mi caso-, la introspección que puede llevar pegada el fin de año y la definición de metas para el siguiente, pueden hacer de esta época un tiempo retador y emocionalmente desafiante.
Te deseo una relación sabia con tu realidad.
Las fiestas de esta temporada, el tiempo en familia o lejos de la familia -como es mi caso-, la introspección que puede llevar pegada el fin de año y la definición de metas para el siguiente, pueden hacer de esta época un tiempo retador y emocionalmente desafiante.
La necesidad de reinventarnos
Cuando llevamos muchos años en la misma práctica, cuando nos volvemos “expertos” exitosos en nuestra materia, de manera natural empezaremos a poner el foco de nuestra atención en aquellos hechos que validan lo que hasta ahora nos ha funcionado
El coaching… ¿qué es?
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Mente de principiante
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Solución Creativa de Problemas
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Nuestro sistema de creencias y nuestras emociones
Las emociones -por suerte para todos-, ahora forman parte de nuestro lenguaje de una forma más abierta. En las organizaciones hace ya algunos años que empezamos a hablar de ellas e incluso a formar a los colaboradores sobre el tema de la Inteligencia Emocional (¡gracias, Daniel Goleman!)
El poder de la vulnerabilidad
La diferencia entre un proceso de coaching y un proceso de mentoría. Esta es una duda muy común, por lo que quiero hablar un poco sobre las diferencias entre ambas metodologías de acompañamiento.
Procesos de Acompañamiento
La diferencia entre un proceso de coaching y un proceso de mentoría. Esta es una duda muy común, por lo que quiero hablar un poco sobre las diferencias entre ambas metodologías de acompañamiento.
Santa Claus is coming to town: una oportunidad de resiliencia.
Las fiestas de esta temporada, el tiempo en familia o lejos de la familia -como es mi caso-, la introspección que puede llevar pegada el fin de año y la definición de metas para el siguiente, pueden hacer de esta época un tiempo retador y emocionalmente desafiante.
Te deseo una relación sabia con tu realidad.
Las fiestas de esta temporada, el tiempo en familia o lejos de la familia -como es mi caso-, la introspección que puede llevar pegada el fin de año y la definición de metas para el siguiente, pueden hacer de esta época un tiempo retador y emocionalmente desafiante.
La necesidad de reinventarnos
Cuando llevamos muchos años en la misma práctica, cuando nos volvemos “expertos” exitosos en nuestra materia, de manera natural empezaremos a poner el foco de nuestra atención en aquellos hechos que validan lo que hasta ahora nos ha funcionado
El coaching… ¿qué es?
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Mente de principiante
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Solución Creativa de Problemas
¿Qué es para ti la creatividad?, ¿qué tan creativo crees que eres?, ¿se nace creativo o te vuelves creativo?, ¿se puede desarrollar la creatividad?, ¿para qué nos sirve?
Este es un tema que ha rondado mi cabeza durante muchos años. La creatividad está ahí, presente todo el tiempo, en ese ingrediente adicional que le pones a la receta que estas preparando para mejorarla, en el cuento que le narras a tus hijos al final de la noche, en la magia que haces para que alcance tu presupuesto y lograr unas buenas vacaciones, en la forma en que resuelves un nuevo desafío con tu equipo.
Nuestro sistema de creencias y nuestras emociones
Las emociones -por suerte para todos-, ahora forman parte de nuestro lenguaje de una forma más abierta. En las organizaciones hace ya algunos años que empezamos a hablar de ellas e incluso a formar a los colaboradores sobre el tema de la Inteligencia Emocional (¡gracias, Daniel Goleman!)
04. Divi Pixel Modules
The last part of this style guide handles some of the most-used modules inside Divi. Here, we’re also providing you with a primary, secondary and tertiary version of each module which you can style and add as a global preset. Feel free to create more alternative designs for each module.
Dual heading
First Second
First Second
supreme Dual heading