Framework

Global Presets UI Style Guide

01. Color palette

In this part of the style guide, you can modify each color inside the Text Module’s background settings. Use that same color code inside the Text Module below it to have a written version of the color code too. Use these color codes inside your Divi Theme Builder default color palette afterward.

#FFFFFF

#F9F9F9

#f2f2f2

#e0e0e0

#444444

#000000

#F9F9F9

#e0e0e0

#444444

#000000

02. Text styles

In the second part of this style guide wireframe, you can style your different text types. You’re also provided with a primary, secondary and tertiary option, each of which you can afterwards turn into individual presets.

Primary

Secondary

Tertiary

Heading 1

Heading 1

Heading 2

Heading 2

Heading 3

Heading 3

Heading 4

Heading 4

Heading 5

Heading 5

Heading 6

Heading 6

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.

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

Paragraph Text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Paragraph Text

03. 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.

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 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.

Email optin

Contact form

4 + 1 =

5 + 11 =

8 + 13 =

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

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

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

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.

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.

Name 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.

Name 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.

Name Goes Here

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

EIT FAN Startup pitching events

EIT FAN Startup pitching events

Is your startup tech-ready to be selected for this year's EIT Food Accelerator Network programme? 📢 Events Round 2 of the EIT FAN 2022 evaluation process will take place in May!  This year, selected startups will be pitching their innovations in front of a live...

A guide to startup funding

A guide to startup funding

Raising money is a key part of being an entrepreneur. Agrifood has some specific challenges around finance given the typically slower growth rates, the seasonality of cash flow and time needed for a return on investment. Whilst some businesses can grow organically and...

Best advice to avoid startup failure

Best advice to avoid startup failure

1. LOVE is a MUST! Running your own business is not an easy ride. Chances are it will be a lot harder (and more rewarding) than you ever could have imagined so make sure you’re working on something you love and care about. Instead of going after any old market...

It’s World Water Day!

It’s World Water Day!

Each year on the 22nd of March, the world celebrates World Water Day, a United Nations observance day that aims to advocate for the sustainable management of freshwater resources. The Agrifood sector relies heavily on fresh water use throughout the food chain, and so...

EIT FAN Startup pitching events

EIT FAN Startup pitching events

Is your startup tech-ready to be selected for this year's EIT Food Accelerator Network programme? 📢 Events Round 2 of the EIT FAN 2022 evaluation process will take place in May!  This year, selected startups will be pitching their innovations in front of a live...

A guide to startup funding

A guide to startup funding

Raising money is a key part of being an entrepreneur. Agrifood has some specific challenges around finance given the typically slower growth rates, the seasonality of cash flow and time needed for a return on investment. Whilst some businesses can grow organically and...

Best advice to avoid startup failure

Best advice to avoid startup failure

1. LOVE is a MUST! Running your own business is not an easy ride. Chances are it will be a lot harder (and more rewarding) than you ever could have imagined so make sure you’re working on something you love and care about. Instead of going after any old market...

It’s World Water Day!

It’s World Water Day!

Each year on the 22nd of March, the world celebrates World Water Day, a United Nations observance day that aims to advocate for the sustainable management of freshwater resources. The Agrifood sector relies heavily on fresh water use throughout the food chain, and so...

EIT FAN Startup pitching events

EIT FAN Startup pitching events

Is your startup tech-ready to be selected for this year's EIT Food Accelerator Network programme? 📢 Events Round 2 of the EIT FAN 2022 evaluation process will take place in May!  This year, selected startups will be pitching their innovations in front of a live...

A guide to startup funding

A guide to startup funding

Raising money is a key part of being an entrepreneur. Agrifood has some specific challenges around finance given the typically slower growth rates, the seasonality of cash flow and time needed for a return on investment. Whilst some businesses can grow organically and...

Best advice to avoid startup failure

Best advice to avoid startup failure

1. LOVE is a MUST! Running your own business is not an easy ride. Chances are it will be a lot harder (and more rewarding) than you ever could have imagined so make sure you’re working on something you love and care about. Instead of going after any old market...

It’s World Water Day!

It’s World Water Day!

Each year on the 22nd of March, the world celebrates World Water Day, a United Nations observance day that aims to advocate for the sustainable management of freshwater resources. The Agrifood sector relies heavily on fresh water use throughout the food chain, and so...

Programmes

Apply to participate in one of our funded flagship programmes

LAUNCH - Seedbed Incubator

ACCELERATE - EIT Food Accelerator Network

SCALE - RisingFoodStars

Our Network

Join our agrifood ecosystem

Our Network

Corporate Venturing

Investors

University & Research Organisations

Programme Hubs