Note: For these tests, the parent query loop is full width. “Inner blocks use content width” on the query loop is turned off, which is the default value.
Inner blocks use content width: Off
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Inner blocks use content width: On
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Grid, 3 columns
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Justification
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Custom width 200px, custom wide width 400px
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Color
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Block spacing
Block spacing preset: 0
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Block spacing preset: 4
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Block spacing preset: 7
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Typography
Font size
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Appearance
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Line height
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Letter spacing
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Decoration
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Letter case
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Social Icons
Pill shaped Logos only Show labels Vertical Icon size Alignment Note: there is a spacer block above to clear the alignment. Justification Color Dimensions Padding preset: 4 Margin preset: 4 Block spacing preset: 4
Labels, placeholders and button texts Button position and icon Alignment Note: there is a spacer block above to clear the alignments Width Color Note: text and background color only affect the button. Border Typography Font size Appearance Line height Letter spacing Decoration Letter case Developer only features Features that do not have a user interface:…
Note: A separator have been added between each query loop.
Title & date variation
Posts Lists
Query Loop
Title & excerpt variation
Quote
Alignment Quote, default (no alignment) Citation Quote, left aligned Citation Quote, centered Citation Quote, right aligned Citation Quote, Plain style variation, default (no alignment) Citation Quote, Plain style variation, left aligned Citation Quote, Plain style variation, centered Citation Quote, Plain style variation, right aligned Citation Color Quote, with text color Citation Quote, with text and…
List
Unordered Ordered A second ordered list with starter value set to 4: Number styles Reverse order Color Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin
Title, date & excerpt variation
The Backbone of Our Nation
Workers, the backbone of our nation, A vital part of our economy’s foundation, From the factories to the fields, Their labor and hard work never yields. They build our cities and keep them running, Their hands are rough, their will is stunning, They toil in the sun and in the rain, Their dedication never wanes.…
Read More
Color Typography Font sizes Appearance Line height Letter spacing Letter case Decoration Border Padding and margin Padding preset: 4 Margin preset: 4
Image, date, and title variation
Hello world!
Workers Go Go!
Post type: page
Filter: “Design” category
Offset: 1
List
Unordered Ordered A second ordered list with starter value set to 4: Number styles Reverse order Color Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin
Heading
H1 Heading H1 Heading, bold H1 Heading, italic H1 Heading, linked H1 Heading, highlighted H2 Heading H3 Heading H4 Heading H5 Heading H6 Heading H2 Heading, wide H2 Heading, full width H2 Heading, left aligned H2 Heading, center H2 Heading, right aligned H2 Heading with text color H2 Heading with text coloor and background color…
Pagination without reload
Quote
Alignment Quote, default (no alignment) Citation Quote, left aligned Citation Quote, centered Citation Quote, right aligned Citation Quote, Plain style variation, default (no alignment) Citation Quote, Plain style variation, left aligned Citation Quote, Plain style variation, centered Citation Quote, Plain style variation, right aligned Citation Color Quote, with text color Citation Quote, with text and…
List
Unordered Ordered A second ordered list with starter value set to 4: Number styles Reverse order Color Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin
Alignment
Quote
Alignment Quote, default (no alignment) Citation Quote, left aligned Citation Quote, centered Citation Quote, right aligned Citation Quote, Plain style variation, default (no alignment) Citation Quote, Plain style variation, left aligned Citation Quote, Plain style variation, centered Citation Quote, Plain style variation, right aligned Citation Color Quote, with text color Citation Quote, with text and…
List
Unordered Ordered A second ordered list with starter value set to 4: Number styles Reverse order Color Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin
Quote
Alignment Quote, default (no alignment) Citation Quote, left aligned Citation Quote, centered Citation Quote, right aligned Citation Quote, Plain style variation, default (no alignment) Citation Quote, Plain style variation, left aligned Citation Quote, Plain style variation, centered Citation Quote, Plain style variation, right aligned Citation Color Quote, with text color Citation Quote, with text and…
List
Unordered Ordered A second ordered list with starter value set to 4: Number styles Reverse order Color Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin
Quote
Alignment Quote, default (no alignment) Citation Quote, left aligned Citation Quote, centered Citation Quote, right aligned Citation Quote, Plain style variation, default (no alignment) Citation Quote, Plain style variation, left aligned Citation Quote, Plain style variation, centered Citation Quote, Plain style variation, right aligned Citation Color Quote, with text color Citation Quote, with text and…
List
Unordered Ordered A second ordered list with starter value set to 4: Number styles Reverse order Color Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin
