system: You are an assistant that generates WordPress patterns.

user: Het stijlgids patroon bevat de standaard blokken en voorbeeld kleurbehandelingen voor het maken van een stijlgids pagina op uw site. Dit patroon is een gemakkelijke manier om de standaard koptekst, tekst, knop, citaat en voorbeeld afbeelding omslag inhoud toe te voegen aan een site die u aan het stylen bent.

assistant: <!-- wp:paragraph -->
<p>Het stijlgids patroon bevat de standaard blokken en voorbeeld kleurbehandelingen voor het maken van een stijlgids pagina op uw site. Dit patroon is een eenvoudige manier om de standaard kopteksten, citaat, knoppen, citaten en afbeelding omslag inhoud toe te voegen aan de inhoud van een site die u aan het stylen bent. Lever de stijlgids bij de site van een klant voor eenvoudige referentie en naleving van het ontwerp.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2>typografie</h2>
<!-- /wp:heading -->

<!-- wp:separator {"align":"wide","className":"is-style-wide"} -->
<hr class="wp-block-separator alignwide has-alpha-channel-opacity is-style-wide" />
<!-- /wp:separator -->

<!-- wp:heading {"level":1} -->
<h1>Koptekst 1</h1>
<!-- /wp:heading -->

<!-- wp:heading -->
<h2>Koptekst 2</h2>
<!-- /wp:heading -->

<!-- wp:heading {"level":3} -->
<h3>Koptekst 3</h3>
<!-- /wp:heading -->

<!-- wp:heading {"level":4} -->
<h4>Koptekst 4</h4>
<!-- /wp:heading -->

<!-- wp:heading {"level":5} -->
<h5>Koptekst 5</h5>
<!-- /wp:heading -->

<!-- wp:heading {"level":6} -->
<h6>Koptekst 6</h6>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p><strong>Paragraaf</strong> <em>typografie</em>. <span style="text-decoration: underline">Heeft u dat gehoord?</span> Ze hebben de hoofdreactor stilgelegd. We zullen zeker vernietigd worden. Dit is waanzin! We zijn verdoemd! Er zal deze keer geen ontsnappen aan de prinses zijn. Wat is dat? Artoo! Artoo-Detoo, waar bent u? Eindelijk! Waar bent u geweest? Ze komen deze kant op. Wat gaan we doen? We worden naar de specerijen mijn van Kessel gestuurd of in wie weet wat vermorzeld!</p>
<!-- /wp:paragraph -->

<!-- wp:separator {"align":"wide","className":"is-style-wide"} -->
<hr class="wp-block-separator alignwide has-alpha-channel-opacity is-style-wide" />
<!-- /wp:separator -->

<!-- wp:heading -->
<h2>kleuren</h2>
<!-- /wp:heading -->

<!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:cover {"overlayColor":"black","minHeight":180,"minHeightUnit":"px"} -->
<div class="wp-block-cover" style="min-height:180px"><span aria-hidden="true" class="wp-block-cover__background has-black-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Schrijf titel...","fontSize":"small"} -->
<p class="has-text-align-center has-small-font-size">#000000</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:cover {"overlayColor":"cyan-bluish-gray","minHeight":180,"minHeightUnit":"px","isDark":false} -->
<div class="wp-block-cover is-light" style="min-height:180px"><span aria-hidden="true" class="wp-block-cover__background has-cyan-bluish-gray-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Schrijf titel...","textColor":"black","fontSize":"small"} -->
<p class="has-text-align-center has-black-color has-text-color has-small-font-size">#ABB8C3</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:cover {"overlayColor":"vivid-cyan-blue","minHeight":180,"minHeightUnit":"px"} -->
<div class="wp-block-cover" style="min-height:180px"><span aria-hidden="true" class="wp-block-cover__background has-vivid-cyan-blue-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Schrijf titel...","textColor":"black","fontSize":"small"} -->
<p class="has-text-align-center has-black-color has-text-color has-small-font-size">#0693E3</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:cover {"overlayColor":"pale-cyan-blue","minHeight":180,"minHeightUnit":"px","isDark":false} -->
<div class="wp-block-cover is-light" style="min-height:180px"><span aria-hidden="true" class="wp-block-cover__background has-pale-cyan-blue-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Schrijf titel...","textColor":"black","fontSize":"small"} -->
<p class="has-text-align-center has-black-color has-text-color has-small-font-size">#8ED1FC</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:separator {"align":"wide","className":"is-style-wide"} -->
<hr class="wp-block-separator alignwide has-alpha-channel-opacity is-style-wide" />
<!-- /wp:separator -->

<!-- wp:heading -->
<h2>knoppen</h2>
<!-- /wp:heading -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button -->
<div class="wp-block-button"><a class="wp-block-button__link wp-element-button">Knop massief</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button">Knop hoofdlijn</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"width":25} -->
<div class="wp-block-button has-custom-width wp-block-button__width-25"><a class="wp-block-button__link wp-element-button">Knop 25%</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"width":50} -->
<div class="wp-block-button has-custom-width wp-block-button__width-50"><a class="wp-block-button__link wp-element-button">Knop 50%</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"width":75} -->
<div class="wp-block-button has-custom-width wp-block-button__width-75"><a class="wp-block-button__link wp-element-button">Knop 75%</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"width":100} -->
<div class="wp-block-button has-custom-width wp-block-button__width-100"><a class="wp-block-button__link wp-element-button">Knop 100%</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:separator {"align":"wide","className":"is-style-wide"} -->
<hr class="wp-block-separator alignwide has-alpha-channel-opacity is-style-wide" />
<!-- /wp:separator -->

<!-- wp:heading -->
<h2>Citaten</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p><strong>Standaard citaat</strong></p>
<!-- /wp:paragraph -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p>Uw lot ligt bij mij, skywalker. Obi-Wan wist dat dit waar was. Nee! Allemaal te gemakkelijk. Misschien bent u niet zo sterk als de keizer dacht. Indrukwekkend... zeer indrukwekkend. Obi-Wan heeft het u goed geleerd. U heeft uw angst onder controle.</p><cite>Darth Vader</cite></blockquote>
<!-- /wp:quote -->

<!-- wp:paragraph -->
<p><strong>Gewoon citaat</strong></p>
<!-- /wp:paragraph -->

<!-- wp:quote {"className":"is-style-plain"} -->
<blockquote class="wp-block-quote is-style-plain"><p>Uw lot ligt bij mij, skywalker. Obi-Wan wist dat dit waar was. Nee! Allemaal te gemakkelijk. Misschien bent u niet zo sterk als de keizer dacht. Indrukwekkend... zeer indrukwekkend. Obi-Wan heeft het u goed geleerd. U heeft uw angst onder controle.</p><cite>Darth Vader</cite></blockquote>
<!-- /wp:quote -->

<!-- wp:separator {"align":"wide","className":"is-style-wide"} -->
<hr class="wp-block-separator alignwide has-alpha-channel-opacity is-style-wide" />
<!-- /wp:separator -->

<!-- wp:heading -->
<h2>Pullquotes</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Citaten die tussen tekstblokken kunnen worden geplaatst of er links of rechts naast.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Pullquote zonder uitlijning.</strong></p>
<!-- /wp:paragraph -->

<!-- wp:pullquote -->
<figure class="wp-block-pullquote"><blockquote><p><strong>Obi-Wan wist dat dit waar was. </strong></p><cite>Darth Vader</cite></blockquote></figure>
<!-- /wp:pullquote -->

<!-- wp:paragraph -->
<p><strong>Pullquote met brede uitlijning.</strong></p>
<!-- /wp:paragraph -->

<!-- wp:pullquote {"align":"wide"} -->
<figure class="wp-block-pullquote alignwide"><blockquote><p><strong>Nee! Allemaal te gemakkelijk. Misschien zijn jullie niet zo sterk als de keizer dacht.</strong></p><cite>Darth Vader</cite></blockquote></figure>
<!-- /wp:pullquote -->

<!-- wp:paragraph -->
<p><strong>Pullquote met uitlijning over de volle breedte</strong></p>
<!-- /wp:paragraph -->

<!-- wp:pullquote {"align":"full"} -->
<figure class="wp-block-pullquote alignfull"><blockquote><p><strong>Indrukwekkend...zeer indrukwekkend. Obi-Wan heeft u goed onderwezen. U heet uw angst onder controle.</strong></p></blockquote></figure>
<!-- /wp:pullquote -->

<!-- wp:paragraph -->
<p><strong>Pullquote met links en rechts uitlijning.</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Heeft u dat gehoord? Ze hebben de hoofdreactor stilgelegd. We zullen zeker vernietigd worden. Dit is waanzin! we zijn verdoemd! er zal deze keer geen ontsnappen aan de prinses zijn. wat is dat? Artoo! Artoo-Detoo, waar bent u? Eindelijk! Waar bent u geweest? Ze komen deze kant op.</p>
<!-- /wp:paragraph -->

<!-- wp:pullquote {"textAlign":"left","align":"left"} -->
<figure class="wp-block-pullquote alignleft has-text-align-left"><blockquote><p>Uw lot ligt bij mij, Skywalker.</p><cite>Darth Vader, links uitgelijnde pullquote</cite></blockquote></figure>
<!-- /wp:pullquote -->

<!-- wp:paragraph -->
<p>Ik moet hem alleen onder ogen komen. Chewie! Ga achter me staan! Ga achter me staan! Zo kunnen we er niet uit. Het lijkt erop dat u onze enige ontsnappingsroute heeft afgesneden. Misschien wilt u het terug in uw cel, uwe hoogheid.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Bent u gek? Met de snelheid die ze krijgen. Door hyperspace reizen is niet zoals gewassen afstoffen, jongen! Zonder precieze berekeningen kunnen we door een ster vliegen of te dicht bij een supernova komen en dan is uw reis snel voorbij, nietwaar? Wat is dat knipperen? We verliezen ons deflectorschild. Ga u vastmaken, ik ga de sprong naar lichtsnelheid maken. We zijn het Alderaan systeem binnengegaan.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Red leader, we zitten recht boven u. Draai naar de punt. Oh-vijf, we dekken u. Blijf daar. Ik heb net mijn stuurboord motor verloren. Maak u klaar om uw aanval uit te voeren. Biggs, wedge, laten we het sluiten.</p>
<!-- /wp:paragraph -->

<!-- wp:pullquote {"textAlign":"left","align":"right"} -->
<figure class="wp-block-pullquote alignright has-text-align-left"><blockquote><p>Uw lot ligt bij mij, Skywalker.</p><cite>Darth vader, rechts uitgelijnde pullquote</cite></blockquote></figure>
<!-- /wp:pullquote -->

<!-- wp:paragraph -->
<p>U zou niet willen dat mijn leven saai wordt, toch? Luke, de force zal met u zijn. Alle vleugels melden zich. Red ten staat klaar. Red seven staat klaar. Red three staat klaar. Rode zes staat klaar. Rode negen staat klaar.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Hou de helft van uw groep buiten bereik voor de volgende run. Begrepen, basis een. Luke, neem red twee en drie. Blijf hier en wacht op mijn teken... Om uw aanval te starten.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Zij is degene in het bericht... We moeten haar helpen. Nou, kijk, krijg geen rare ideeën. De oude man wil dat we hier wachten.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Waar gaat u heen? Nou, ik ga niet die kant op. Het is veel te rotsachtig. Deze weg is veel makkelijker. Waarom denkt u dat daar nederzettingen zijn? Doe niet zo technisch. Welke missie? Waar heeft u het over? Ik heb genoeg van u! Ga die kant op! Binnen een dag bent u defect, u bijziende schroothoop! En laat me u niet betrappen dat u me volgt smekend om hulp, want die krijgt u niet. Geen avonturen meer.</p>
<!-- /wp:paragraph -->

<!-- wp:separator {"align":"wide","className":"is-style-wide"} -->
<hr class="wp-block-separator alignwide has-alpha-channel-opacity is-style-wide" />
<!-- /wp:separator -->

<!-- wp:heading -->
<h2>Voorbeeld tekst en kleur behandeling</h2>
<!-- /wp:heading -->

<!-- wp:cover {"url":"https://img.rawpixel.com/s3fs-private/rawpixel_images/website_content/pd36-2-pia11735_orig.jpg?w=1200&h=1200&fit=clip&crop=default&dpr=1&q=75&vib=3&con=3&usm=15&cs=srgb&bg=F4F4F3&ixlib=js-2.2.1&s=44e5721d038ddca51c84b8ff96099368","id":null,"dimRatio":60,"focalPoint":{"x":"0.37","y":"0.47"},"minHeight":596,"minHeightUnit":"px","customGradient":"linear-gradient(135deg,rgb(2,3,129) 49%,rgb(40,116,252) 100%)","contentPosition":"bottom left","align":"full","style":{"spacing":{"padding":{"top":"80px","right":"80px","bottom":"20px","left":"80px"}}}} -->
<div class="wp-block-cover alignfull has-custom-content-position is-position-bottom-left" style="padding-top:80px;padding-right:80px;padding-bottom:20px;padding-left:80px;min-height:596px"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-60 has-background-dim wp-block-cover__gradient-background has-background-gradient" style="background:linear-gradient(135deg,rgb(2,3,129) 49%,rgb(40,116,252) 100%)"></span><img class="wp-block-cover__image-background" alt="" src="https://img.rawpixel.com/s3fs-private/rawpixel_images/website_content/pd36-2-pia11735_orig.jpg?w=1200&amp;h=1200&amp;fit=clip&amp;crop=default&amp;dpr=1&amp;q=75&amp;vib=3&amp;con=3&amp;usm=15&amp;cs=srgb&amp;bg=F4F4F3&amp;ixlib=js-2.2.1&amp;s=44e5721d038ddca51c84b8ff96099368" style="object-position:37% 47%" data-object-fit="cover" data-object-position="37% 47%" /><div class="wp-block-cover__inner-container"><!-- wp:group {"layout":{"contentSize":"600px"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":5,"textColor":"white","fontSize":"large"} -->
<h5 class="has-white-color has-text-color has-large-font-size">Categorie of subrubriek</h5>
<!-- /wp:heading -->

<!-- wp:heading -->
<h2>Een overtuigende header die lezers uw inhoud in trekt.</h2>
<!-- /wp:heading -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"pale-cyan-blue","textColor":"black","className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-black-color has-pale-cyan-blue-background-color has-text-color has-background wp-element-button">CALL TO ACTION</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:group --></div></div>
<!-- /wp:cover -->

<!-- wp:paragraph -->
<p></p>
<!-- /wp:paragraph -->