{"id":6,"date":"2026-08-19T16:19:57","date_gmt":"2026-08-19T16:19:57","guid":{"rendered":"https:\/\/blockset.wp.philiprehberger.com\/?page_id=6"},"modified":"2026-08-19T16:19:59","modified_gmt":"2026-08-19T16:19:59","slug":"blockset-home","status":"publish","type":"page","link":"https:\/\/blockset.wp.philiprehberger.com\/","title":{"rendered":"Blockset"},"content":{"rendered":"\n<div class=\"wp-block-cover\" style=\"padding-top:var(--wp--preset--spacing--80);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--80);padding-left:var(--wp--preset--spacing--50);min-height:520px;aspect-ratio:unset;\"><span aria-hidden=\"true\" class=\"wp-block-cover__background has-primary-dark-background-color has-background-dim-60 has-background-dim\"><\/span><img decoding=\"async\" class=\"wp-block-cover__image-background\" alt=\"\" src=\"https:\/\/blockset.wp.philiprehberger.com\/wp-content\/uploads\/2026\/08\/hero.png\" data-object-fit=\"cover\"\/><div class=\"wp-block-cover__inner-container is-layout-constrained has-global-padding wp-container-core-cover-is-layout-05cec68a wp-block-cover-is-layout-constrained\">\n\n<p class=\"has-text-align-center has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.2em;text-transform:uppercase\">SFP-BLOCKS \u00b7 OPEN SOURCE \u00b7 GPL-2.0<\/p>\n\n\n<h1 class=\"wp-block-heading has-text-align-center has-text-color\" style=\"color:var(--wp--preset--color--base);font-family:var(--wp--preset--font-family--serif);font-size:clamp(2.5rem, 6vw, 4.25rem);font-weight:500;letter-spacing:-0.025em;line-height:1.05;margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40)\">Server-rendered blocks<br>for FSE themes.<\/h1>\n\n\n<p class=\"has-text-align-center has-text-color has-medium-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--base);line-height:1.55\">A small, opinionated library of Gutenberg blocks. Each one is server-rendered, FSE-native, and shipped without runtime framework dependencies. Built for the demos on the portfolio platform; documented here so they&rsquo;re useful to anyone else.<\/p>\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-43f73530 wp-block-buttons-is-layout-flex\" style=\"margin-top:var(--wp--preset--spacing--60)\">\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-primary-dark-color has-accent-background-color has-text-color has-background wp-element-button\" style=\"border-radius:4px\" href=\"\/blocks\/\">Browse the library<\/a><\/div>\n\n\n<div class=\"wp-block-button is-style-outline is-style-outline--1\"><a class=\"wp-block-button__link has-base-color has-text-color wp-element-button\" style=\"border-color:var(--wp--preset--color--base);border-width:1px;border-radius:4px\" href=\"https:\/\/github.com\/philiprehberger\/wp-portfolio-platform\">View on GitHub<\/a><\/div>\n\n<\/div>\n\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-container-core-group-is-layout-43a1645c wp-block-group-is-layout-constrained\" style=\"padding-top:var(--wp--preset--spacing--80);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--50)\">\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.12em;text-transform:uppercase\">SEVEN BLOCKS IN THE LIBRARY<\/p>\n\n\n<h2 class=\"wp-block-heading\" style=\"font-family:var(--wp--preset--font-family--serif);font-weight:500;letter-spacing:-0.02em;margin-top:var(--wp--preset--spacing--30);margin-bottom:var(--wp--preset--spacing--40)\">Each one built for a real demo.<\/h2>\n\n\n<p class=\"wp-block-paragraph\" style=\"line-height:1.6\">Every block in the library was authored because a demo needed it. The trust stack came from the Pulsar SaaS landing; portfolio-grid was the Hillcrest architecture portfolio; menu-section drives both Tavern North&rsquo;s food menu and its wine list; listing-grid powers the Salt &amp; Cedar real-estate cards; code-snippet is what you&rsquo;re reading on every docs page here. The blocks stay generic; the demos stay specific.<\/p>\n\n<\/div>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-container-core-group-is-layout-faaaa422 wp-block-group-is-layout-constrained\" style=\"padding-top:0;padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--80);padding-left:var(--wp--preset--spacing--50)\">\n\n<div class=\"wp-block-query is-layout-flow wp-block-query-is-layout-flow\">\n<ul class=\"is-flex-container columns-3 wp-block-post-template is-layout-flow wp-block-post-template-is-layout-flow\"><li class=\"wp-block-post post-17 page type-page status-publish hentry\">\n\n<div class=\"wp-block-group has-white-background-color has-background has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-de617950 wp-block-group-is-layout-constrained\" style=\"border-color:var(--wp--preset--color--border);border-width:1px;border-radius:6px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)\">\n<h3 style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.682), 1.25rem);font-family:var(--wp--preset--font-family--serif);font-weight:600;letter-spacing:-0.005em;margin-top:0;margin-bottom:var(--wp--preset--spacing--20)\" class=\"has-link-color wp-elements-1 wp-block-post-title has-text-color has-primary-color\"><a href=\"https:\/\/blockset.wp.philiprehberger.com\/?page_id=17\" target=\"_self\" >Code snippet<\/a><\/h3>\n<div style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.115), 0.938rem);line-height:1.5\" class=\"wp-block-post-excerpt has-text-color has-muted-color\"><p class=\"wp-block-post-excerpt__excerpt\">Styled code block with language label and copy-to-clipboard. New. <\/p><\/div>\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-top:var(--wp--preset--spacing--30);margin-bottom:0\">View docs \u2192<\/p>\n\n<\/div>\n\n<\/li><li class=\"wp-block-post post-16 page type-page status-publish hentry\">\n\n<div class=\"wp-block-group has-white-background-color has-background has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-de617950 wp-block-group-is-layout-constrained\" style=\"border-color:var(--wp--preset--color--border);border-width:1px;border-radius:6px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)\">\n<h3 style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.682), 1.25rem);font-family:var(--wp--preset--font-family--serif);font-weight:600;letter-spacing:-0.005em;margin-top:0;margin-bottom:var(--wp--preset--spacing--20)\" class=\"has-link-color wp-elements-2 wp-block-post-title has-text-color has-primary-color\"><a href=\"https:\/\/blockset.wp.philiprehberger.com\/?page_id=16\" target=\"_self\" >Listing grid<\/a><\/h3>\n<div style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.115), 0.938rem);line-height:1.5\" class=\"wp-block-post-excerpt has-text-color has-muted-color\"><p class=\"wp-block-post-excerpt__excerpt\">Card grid querying any post type. Price, beds\/baths\/sqft, location, CTA. <\/p><\/div>\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-top:var(--wp--preset--spacing--30);margin-bottom:0\">View docs \u2192<\/p>\n\n<\/div>\n\n<\/li><li class=\"wp-block-post post-15 page type-page status-publish hentry\">\n\n<div class=\"wp-block-group has-white-background-color has-background has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-de617950 wp-block-group-is-layout-constrained\" style=\"border-color:var(--wp--preset--color--border);border-width:1px;border-radius:6px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)\">\n<h3 style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.682), 1.25rem);font-family:var(--wp--preset--font-family--serif);font-weight:600;letter-spacing:-0.005em;margin-top:0;margin-bottom:var(--wp--preset--spacing--20)\" class=\"has-link-color wp-elements-3 wp-block-post-title has-text-color has-primary-color\"><a href=\"https:\/\/blockset.wp.philiprehberger.com\/?page_id=15\" target=\"_self\" >Menu section<\/a><\/h3>\n<div style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.115), 0.938rem);line-height:1.5\" class=\"wp-block-post-excerpt has-text-color has-muted-color\"><p class=\"wp-block-post-excerpt__excerpt\">Name \/ description \/ price rows with dotted leaders + optional flag badges. <\/p><\/div>\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-top:var(--wp--preset--spacing--30);margin-bottom:0\">View docs \u2192<\/p>\n\n<\/div>\n\n<\/li><li class=\"wp-block-post post-14 page type-page status-publish hentry\">\n\n<div class=\"wp-block-group has-white-background-color has-background has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-de617950 wp-block-group-is-layout-constrained\" style=\"border-color:var(--wp--preset--color--border);border-width:1px;border-radius:6px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)\">\n<h3 style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.682), 1.25rem);font-family:var(--wp--preset--font-family--serif);font-weight:600;letter-spacing:-0.005em;margin-top:0;margin-bottom:var(--wp--preset--spacing--20)\" class=\"has-link-color wp-elements-4 wp-block-post-title has-text-color has-primary-color\"><a href=\"https:\/\/blockset.wp.philiprehberger.com\/?page_id=14\" target=\"_self\" >Portfolio grid<\/a><\/h3>\n<div style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.115), 0.938rem);line-height:1.5\" class=\"wp-block-post-excerpt has-text-color has-muted-color\"><p class=\"wp-block-post-excerpt__excerpt\">Masonry-style image grid with per-item size, server-rendered. <\/p><\/div>\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-top:var(--wp--preset--spacing--30);margin-bottom:0\">View docs \u2192<\/p>\n\n<\/div>\n\n<\/li><li class=\"wp-block-post post-12 page type-page status-publish hentry\">\n\n<div class=\"wp-block-group has-white-background-color has-background has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-de617950 wp-block-group-is-layout-constrained\" style=\"border-color:var(--wp--preset--color--border);border-width:1px;border-radius:6px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)\">\n<h3 style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.682), 1.25rem);font-family:var(--wp--preset--font-family--serif);font-weight:600;letter-spacing:-0.005em;margin-top:0;margin-bottom:var(--wp--preset--spacing--20)\" class=\"has-link-color wp-elements-5 wp-block-post-title has-text-color has-primary-color\"><a href=\"https:\/\/blockset.wp.philiprehberger.com\/?page_id=12\" target=\"_self\" >Product comparison<\/a><\/h3>\n<div style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.115), 0.938rem);line-height:1.5\" class=\"wp-block-post-excerpt has-text-color has-muted-color\"><p class=\"wp-block-post-excerpt__excerpt\">Side-by-side feature matrix with \u2713 \/ \u2717 and per-column CTA. <\/p><\/div>\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-top:var(--wp--preset--spacing--30);margin-bottom:0\">View docs \u2192<\/p>\n\n<\/div>\n\n<\/li><li class=\"wp-block-post post-13 page type-page status-publish hentry\">\n\n<div class=\"wp-block-group has-white-background-color has-background has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-de617950 wp-block-group-is-layout-constrained\" style=\"border-color:var(--wp--preset--color--border);border-width:1px;border-radius:6px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)\">\n<h3 style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.682), 1.25rem);font-family:var(--wp--preset--font-family--serif);font-weight:600;letter-spacing:-0.005em;margin-top:0;margin-bottom:var(--wp--preset--spacing--20)\" class=\"has-link-color wp-elements-6 wp-block-post-title has-text-color has-primary-color\"><a href=\"https:\/\/blockset.wp.philiprehberger.com\/?page_id=13\" target=\"_self\" >Test card helper<\/a><\/h3>\n<div style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.115), 0.938rem);line-height:1.5\" class=\"wp-block-post-excerpt has-text-color has-muted-color\"><p class=\"wp-block-post-excerpt__excerpt\">Inline Stripe sandbox test cards for the demo checkout flow. <\/p><\/div>\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-top:var(--wp--preset--spacing--30);margin-bottom:0\">View docs \u2192<\/p>\n\n<\/div>\n\n<\/li><li class=\"wp-block-post post-11 page type-page status-publish hentry\">\n\n<div class=\"wp-block-group has-white-background-color has-background has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-de617950 wp-block-group-is-layout-constrained\" style=\"border-color:var(--wp--preset--color--border);border-width:1px;border-radius:6px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)\">\n<h3 style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.682), 1.25rem);font-family:var(--wp--preset--font-family--serif);font-weight:600;letter-spacing:-0.005em;margin-top:0;margin-bottom:var(--wp--preset--spacing--20)\" class=\"has-link-color wp-elements-7 wp-block-post-title has-text-color has-primary-color\"><a href=\"https:\/\/blockset.wp.philiprehberger.com\/?page_id=11\" target=\"_self\" >Trust stack<\/a><\/h3>\n<div style=\"font-size:clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.115), 0.938rem);line-height:1.5\" class=\"wp-block-post-excerpt has-text-color has-muted-color\"><p class=\"wp-block-post-excerpt__excerpt\">Animated stat counters for SaaS landings + social proof rows. <\/p><\/div>\n\n<p class=\"has-text-color has-small-font-size wp-block-paragraph\" style=\"color:var(--wp--preset--color--accent-dark);font-family:var(--wp--preset--font-family--mono);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;margin-top:var(--wp--preset--spacing--30);margin-bottom:0\">View docs \u2192<\/p>\n\n<\/div>\n\n<\/li><\/ul>\n\n<\/div>\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>SEVEN BLOCKS IN THE LIBRARY Each one built for a real demo. Every block in the library was authored because a demo needed it. The trust stack came from the Pulsar SaaS landing; portfolio-grid was the Hillcrest architecture portfolio; menu-section drives both Tavern North&rsquo;s food menu and its wine list; listing-grid powers the Salt &amp; [&hellip;]<\/p>\n","protected":false},"author":0,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6"}],"version-history":[{"count":1,"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":9,"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions\/9"}],"wp:attachment":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}