Values three principles, Pattern Paste Canonical: https://patternpaste.com/pattern/values-three-principles.html Core Patterns (https://patternpaste.com/patterns/) Features (https://patternpaste.com/patterns/features/) Catalogue access Standard # Values three principles An about-page values band. A tracked label, a heading and a short intro sit over three ruled rows; each row runs a numbered principle at the left, a short explanation in the middle and, at the right, the figure that proves it set at display size with a line of caption. Every promise is signed off by a number rather than an adjective. States no colour and no font of its own. ## All patterns Search patterns Loading patterns… Start here ## What to change first The heading and intro, then each principle, its explanation and its figure. Keep a figure you can stand behind: it is the point of the row. The signature moment ## Every principle is signed off by its proof The right-hand column of each row is a number at display size, not a sentence. The principle is the claim; the figure at clamp(2.5rem, 4.4vw, 4rem) with one line of caption is the evidence, so the eye runs down the right edge and reads three proofs before it reads a word of explanation. It survives colourlessness because it is scale and position: the same column, the same size, three times, between full-width rules. Theme handoff ## What comes from where ### From your theme - The ground is base and every line of type is contrast, each a two-rung chain. Text is at 4.5:1 or better in the stock themes; the figures are large display at 3:1 or better. - The numerals and the label start on role-label, the rules on role-rule; both fall through to contrast. - The section heading is off the ladder on purpose, a bare clamp(2.25rem, 4.2vw, 4rem), so it holds its own against the figures; the principle titles are a bare clamp(1.5rem, 2.2vw, 2rem), the second mass on the section. Body copy takes medium. - The typeface is your theme's. ### Set by this pattern - The intro sits in a 40rem group so it stays under 75 characters a line. - Each row is three columns at 36, 38 and 26 per cent, stacking below 782px with the principle first and its proof last. Full pattern notes ## Why it works, and how it is built Open a topic for the complete design reasoning, editing guidance and implementation notes. Design rationaleComposition, intent and nearest alternatives ### Overview An about-page values band for a charity, a clinic or any small organisation that wants its values believed. A tracked label, a heading and a two-line intro sit over three ruled rows. Each row holds a numbered principle, a short explanation, and the figure that proves it. ### The signature moment: every principle is signed off by its proof The right-hand column of each row is a number at display size, not a sentence. The principle is the claim; the figure at clamp(2.5rem, 4.4vw, 4rem) with one line of caption is the evidence, so the eye runs down the right edge and reads three proofs before it reads a word of explanation. It survives colourlessness because it is scale and position: the same column, the same size, three times, between full-width rules. Make it yoursVariations and the edits to make first ### What to change first The heading and intro, then each principle, its explanation and its figure. Keep a figure you can stand behind: it is the point of the row. Theme behaviourInheritance, fixed decisions and contrast ### What it inherits from your theme - The ground is base and every line of type is contrast, each a two-rung chain. Text is at 4.5:1 or better in the stock themes; the figures are large display at 3:1 or better. - The numerals and the label start on role-label, the rules on role-rule; both fall through to contrast. - The section heading is off the ladder on purpose, a bare clamp(2.25rem, 4.2vw, 4rem), so it holds its own against the figures; the principle titles are a bare clamp(1.5rem, 2.2vw, 2rem), the second mass on the section. Body copy takes medium. - The typeface is your theme's. ### What it decides for itself - The intro sits in a 40rem group so it stays under 75 characters a line. - Each row is three columns at 36, 38 and 26 per cent, stacking below 782px with the principle first and its proof last. Technical notesBlock mechanics, responsive behaviour and constraints ### The Styled look porcelain-and-kingfisher states a porcelain ground #f2f6f6, deep teal-navy type and rules #12303b (12.8:1) and the proof figures in kingfisher #0b6784 (5.9:1), in Avenir Next throughout, falling back to Segoe UI and Arial. The small labels stay in the ink. It is for a charity, a hospice or a clinic. Questions ## Values three principles: common questions Does Values three principles need a plugin? No. It is built only from core WordPress blocks (column, columns, group, heading and paragraph), so it pastes into the block editor with nothing to install. Will Values three principles match my theme? Choose by variation. Three principles takes your theme’s palette; Porcelain and kingfisher brings its own colours. How many variations does Values three principles have? 2: Three principles and Porcelain and kingfisher. Each is its own markup; choose one in the toolbar above the preview before you copy. Is Values three principles free? It is included with a subscription, with every Core Pattern and variation. 56 Core Patterns are free to copy without one. Which WordPress version does it need? Requires a block theme on WordPress 7.0. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type. 16KB of core-block markup, 5 blocks (column, columns, group, heading, paragraph), and nothing else: paste it into the block editor and it becomes editable blocks wearing your theme. Subscribe to copy it, £119 a year (https://patternpaste.com/account/#plan) What you copy is yours forever. Cancel whenever. Back to Core Patterns (https://patternpaste.com/patterns/) Catalogue access ### £119 a year All patterns, variations and theme downloads. What you copy is yours forever. Cancel whenever. Subscribe, £119 a year (https://patternpaste.com/account/#plan) Sign in (https://patternpaste.com/account/) Everything you copy is yours to keep, forever, on any site; access to the rest of the library runs while you subscribe. Cancel any time; access runs to the end of the period you have paid for, and there is no pro-rata refund. Prices are in pounds and are the full price in the UK, the US and eleven other countries; elsewhere the checkout adds your local VAT or sales tax. The terms name every country. #### Pair with Hero Hero aperture An opening section on your theme's own paper: a tracked line, a display headline, one short paragraph on a reading measure, and then a picture that stops short of the edge on every side. The signature is the margin: the image is a window cut in the page rather than a band across it, and the paper around it is what you notice. A small opaque plate in the picture's bottom-right corner carries the caption, so no type ever sits on the photograph. The still-image version includes an example photograph; select your own clip for the video version. States no colour and no font of its own. (https://patternpaste.com/pattern/hero-aperture.html)How it works Steps cards Four photographic process cards with level tops and descending feet. Each plate carries a replaceable WordPress image, a tracked step label, a short title and one sentence. The grid stretches the cards while their bottom margins draw the stair, reflowing into pairs and then a single column as the page narrows. States no colour and no font of its own. (https://patternpaste.com/pattern/steps-cards.html)Compare Compact comparison rows A mobile-first responsive comparison layout using stacked capability cards: each row pairs a feature title and summary with a side-by-side comparison block, avoiding horizontal table scrolling on small screens. States no colour and no font of its own. (https://patternpaste.com/pattern/compare-compact-rows.html) #### Before you paste Requires a block theme on WordPress 7.0. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type. How we test patterns (https://patternpaste.com/how-we-test/) ## Specifications Section Features Access Subscription Plugin None, core blocks only Variations 2 Colour From your theme or its own palette Type From your theme or its own type Motion None Blocks column, columns, group, heading, paragraph Presets color 6, spacing 6, font-size 1 WordPress 7.0+ Continue exploring ## Next in Features Explore all 30 Features patterns (https://patternpaste.com/patterns/features/) Shot in Twenty Twenty-Five Features No plugin needed ### Services photo cards Six service cards for a trade or local business, each a 4:3 photograph, the service name, one line of what is included and a starting price set larger than the name, on a ruled foot beside its booking link. Features Preview pattern (https://patternpaste.com/pattern/services-photo-cards.html) Shot in Twenty Twenty-Five Features No plugin needed ### Venue spaces capacity Three hireable spaces for an events venue, each a photograph, the room name, its standing and seated capacity set as two display figures between rules, a line of what is included and an Enquire button on the foot. Features Preview pattern (https://patternpaste.com/pattern/venue-spaces-capacity.html) Shot in Twenty Twenty-Five Features No plugin needed ### Why choose us checklist A single claim at display size on one side and six ruled check rows on the other, each a large tick, a short promise and one line of proof. Features Preview pattern (https://patternpaste.com/pattern/why-choose-us-checklist.html)