Oak Base – Framework
Global Presets UI Style Guide
01. Color palette
Here are Your Main Colors for Your Website Framework.
Primary Color
Secondary Color
ACCENT
Heading Color
Body Color
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.
Heading Font Family:
Body Font Family:
Default Body
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
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.
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
Primary
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
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.
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
White
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
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.
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
Secondary
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
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.
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
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
White
Button
Blurb
Default
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.
Primary Text
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.
Primary BG - White TXT
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.
Image
Rounded Edges: 8px
Animation: Slide Center
Box Shadow
Hover: Transform Animation
Call to action
Primary - Default
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.
Secondary
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.
Video
Toggle
Default - Primary Color
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.
Secondary Color
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.
Accordion
Default - Primary Color
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.
Secondary Color
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.
Black
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.
03. Saved Library Sections
These sections allow you to easily add new items throughout your website.
Section Library Announcement & Events
Events
FMC YOUNG ADULTS
Join our six-week study group every Wednesday at 7 PM to explore Old Testament characters and build real relationships in a welcoming space.
FMC MARRIAGE GROUP
First Methodist Carlsbad welcomes you and your spouse to join us for an encouraging practical class focusing on...
Truth and Grace
God's Design For the Body and Relationships In an age of deep confusion about sexuality, identity, and relationships, this...
Section Library Next Step Icons
New Here?
Check Out These Starting Points
Plan Your Visit
Meet The Staff Team
Email Us With Questions
Get Directions
Section Library FAQ
What do you offer for my children?
On Sundays:
Nursery Care
We provide responsible childcare so parents can worship in the main service free of distraction.
- The upstairs nursery room is open for parents to use in caring for infants without volunteer support during the regular Sunday services.
- Our toddler Nursery provides care for children who are nine months to three years old.
Each child in the Nursery is checked in when brought to the nursery. A parent will receive a text to the cell phone number given if the nursery staff needs them to come help their child. Parents will need to show their parent sticker when picking up their child.
Sunday School
- The Family Ministry team offers Sunday School classes for children Pre-K through 8th grade on the 2nd and 4th Sundays of the month. Each lesson offers a Biblical teaching and discussion. More information can be found HERE. Our teachers have a passion to help their students to grow spiritually and to have a fulfilling life.
Sunday school volunteers perform security check-in for children in the upstairs lobby starting at 9:15 am. The Nursery (9 months – 3 years) opens at 9:15 downstairs. Grades pre-k to 8th-grade worship in the sanctuary and will be dismissed to their classes following worship.
- On the 1st and 3rd Sunday of the month, our children stay in service with everyone. We call these our family Sundays. There is a special teaching time for them and are sometimes asked to participate in various parts by our teaching team. Activity pages are available for children in the lobby these days, and they are of course welcome to bring other activities in with them.
On Wednesdays:
Lifeline, for middle and high schoolers meets from 7 to 9pm. Learn more about Lifeline HERE (will link)
Do you have a group for middle schoolers and high schoolers?
On Sundays:
Sunday School
- The Family Ministry team offers Sunday School classes for children Pre-K through 8th grade on the 2nd and 4th Sundays of the month. Each lesson offers a Biblical teaching and discussion. More information can be found at HERE. Our teachers have a passion to help their students to grow spiritually and to have a fulfilling life.
Grades pre-k to 8th-grade worship in the sanctuary and will be dismissed to their classes following worship.
- On the 1st and 3rd Sunday of the month, our children stay in service with everyone. We call these our family Sundays.
On Wednesdays:
Lifeline, for middle and high schoolers meets from 7 to 9pm. Learn more about Lifeline HERE
What is a {{Small_Groups}}?
{{Small_Groups}} are gatherings of saints who desire life transformation, discipleship, leadership development and multiplication on both a personal and group level. These groups meet outside of the Sunday gathering in people’s homes.
LEARN MORE HERE
What do I wear on a Sunday?
info about that here
What are your beliefs?
We are part of the Southeast Church Alliance, a collection of autonomous churches seeking to fulfill the Great Commission both indivudally and together. You can read our full Statement of Faith HERE
Section Library Page Title
New Here
Section Library Page Title
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.
1/2 IMG + 1/2 TXT
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.
1/2 IMG + 1/2 TXT
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.