XtremelySocial Logo

Our Block Theme Styles

Samples of various styles within the theme

Flat Blocks is built specifically for the latest WordPress Block Editor and Full Site Editing capabilities. The following depicts the basic styles of the theme.

Table of Contents

    Theme Color Palette

    All of our themes includes a rich “flat” style color palette with over two dozen colors that are all designed to look great together. Any of these colors can be selected for buttons, groups, columns, paragraphs, etc. You can use them both for background colors as well as foreground colors.

    Current Theme Style Colors

    Flat Blocks comes with dozens of Theme Styles with different color presets and font pairs that can be mixed and matched. It is best to use these color names so that your content changes colors automatically when you change Theme Styles.

    This is the default color scheme and fonts.

    Primary

    Primary Alt

    Secondary

    Secondary Alt

    Tertiary

    Tertiary Alt

    Dark

    Dark Alt

    Base

    Contrast

    Fore-ground Alt

    Neutral

    Neutral Alt

    All Theme Colors

    This is the full color-palette that is always available, regardless of which Theme Style variation is selected.

    White

    Off White

    Very Light Gray

    Light Gray

    Gray

    Dark Gray

    Light Green

    Green

    Bright Green

    Dark Bright Green

    Light Yellow

    Yellow

    Light Orange

    Orange

    Dark Orange

    Light Blue

    Blue

    Dark Blue

    Midnight Blue

    Dark Midnight Blue

    Light Purple

    Purple

    Dark Purple

    Light Red

    Red

    Dark Red

    Very Dark Gray

    Almost Black

    Not Quite Black

    Black

    Back to Top

    Headings & Alignments

    You can use standard H2 through H6 headings which go from large to small. Note that H1 is reserved for page titles because there should only be one per page. H2 is above and H3 through H6 are below.

    Heading 3

    Heading 4

    Heading 5
    Heading 6

    Of course WordPress has left, center, and right alignment that you can choose from the Block Editor.

    Left aligned text

    Center aligned text

    Right aligned text

    Back to Top

    Lists

    Unordered List

    • List item 1
    • List item 2
    • List item 3
    • List item 4

    Checkmark Style List

    • List item 1
    • List item 2
    • List item 3
    • List item 4

    Back to Top

    Groups

    Group

    One of the best features of the new WordPress Block Editor is grouping blocks into “sections”.

    These groups contain other blocks, such as headings, paragraphs, images, columns, buttons, etc.

    This way, you can build complex layouts like you see on professional websites with “call to action” sections (header, text, and button), “services” or “features” blocks (columns of information), etc.

    Media & Text

    Phosfluorescently morph intuitive relationships rather than customer directed human capital. Dynamically customize turnkey information whereas orthogonal processes. Assertively deliver superior leadership skills whereas holistic outsourcing. Enthusiastically iterate enabled best practices vis-a-vis 24/365 communities.

    Back to Top

    Columns

    This is left text column.

    Appropriately initiate pandemic data via economically sound scenarios. Credibly foster inexpensive methodologies via cross-media leadership. Dramatically monetize seamless infomediaries via principle-centered functionalities. Seamlessly morph cross functional outsourcing via team building meta-services. Intrinsicly embrace installed base products for enabled testing procedures.

    This is right text column.

    Completely disintermediate user friendly content through covalent core competencies. Enthusiastically seize intermandated alignments for resource sucking paradigms. Intrinsicly engineer sustainable initiatives through resource maximizing benefits. Efficiently fashion top-line vortals through distributed interfaces. Intrinsicly engage performance based mindshare with best-of-breed outsourcing.

    Back to Top

    Quotes

    Standard Quote

    Take up one idea, make that one idea your life. Think of it, dream of it, Live on that idea let the brain, muscles, nerves, every part of your body be full of that idea, and just leave every other idea alone. This is the way to success.

    – Swami Vivekananda

    Large Quote

    Take up one idea, make that one idea your life. Think of it, dream of it, Live on that idea let the brain, muscles, nerves, every part of your body be full of that idea, and just leave every other idea alone. This is the way to success.

    – Swami Vivekananda

    Pull Quote

    Take up one idea, make that one idea your life. Think of it, dream of it, Live on that idea let the brain, muscles, nerves, every part of your body be full of that idea, and just leave every other idea alone. This is the way to success.

    – Swami Vivekananda

    Back to Top

    Code, Pre-formatted, & Verse

    Code

    @media only screen and (min-width: 960px) {

	body .alignfull {
		width: auto;
		max-width: 1000%;

		margin-right: calc(50% - 50vw);
		margin-left: calc(50% - 50vw);
	}

	body .alignwide {
		width: auto;
		max-width: 1000%;
		margin-right: calc(25% - 25vw);
		margin-left: calc(25% - 25vw);
	}

	.alignwide img,
	.alignfull img {
		display: block;
		margin: 0 auto;
	}
}

    Pre-formatted

    This is some preformatted text. Preformatted text keeps your s p a c e s, tabs and
    linebreaks as they are.

    Verse

    Write poetry and other literary expressions honoring all spaces and line-breaks.
How now
Brown cow

    Back to Top

    Tables

    Standard Table

    Heading 1Heading 2
    Row 1 Column 1Row 1 Column 2
    Row 2 Column 1Row 2 Column 2
    Row 3 Column 1Row 3 Column 2
    Footer 1Footer 2
    Table Caption

    Stripes Style Table

    Heading 1Heading 2
    Row 1 Column 1Row 1 Column 2
    Row 2 Column 1Row 2 Column 2
    Row 3 Column 1Row 3 Column 2
    Footer 1Footer 2
    Table Caption

    Back to Top

    Calendar

    December 2024
    M T W T F S S
     1
    2345678
    9101112131415
    16171819202122
    23242526272829
    3031  

    Back to Top

    Separators

    Back to Top

    Images

    Default Width

    Back to Top

    Wide Width

    Full Width

    Back to Top

    Cover Image

    This block can be used for a “Hero” section.
    Full width has been applied.

    Back to Top

    Latest Comments

    Latest Comments (Standard)

    Latest Comments (Bullet Style)

    Latest Comments (Avatar, Date, and Excerpt)

    Back to Top