Added block quote.

src/_palette.scss

@@ -157,6 +157,7 @@ $pink900: #8C2055;
 $pink: $pink500;
 
 $surface: $grey100;
+$standout: $grey50;
 $text: $grey800;
 
 $primary50: $sea50;

src/text.scss

@@ -1,4 +1,31 @@
+@use "palette";
+
 p {
     font-family: 'Alegreya', serif;
     font-size: 1rem;
+}
+
+blockquote {
+    position: relative;
+    font-family: 'Alegreya', serif;
+    margin: 1rem;
+    padding: 1rem;
+    background-color: palette.$standout;
+    // border-left: .3rem solid palette.$primary;
+    box-shadow: .5rem .5rem 0 0 palette.$grey200;
+
+    &::before {
+        font-family: 'Alegreya', serif;
+        font-size: 2rem;
+        text-align: center;
+        content: '"';
+        position: absolute;
+        top: -.75rem;
+        left: -.75rem;
+        border-radius: 100%;
+        color: palette.$text;
+        background-color: palette.$primary;
+        height: 2rem;
+        width: 2rem;
+    }
 }

web/pages/index.njk

@@ -4,6 +4,7 @@
 	<header>
 		<h1>Welcome to Nebulosa CSS!</h1>
 	</header>
-	<a href="/headings">Headings</a>
-	<a href="/buttons">Buttons</a>
+	<p><a href="/headings">Headings</a></p>
+	<p><a href="/buttons">Buttons</a></p>
+	<p><a href="/text">Text</a></p>
 {% endblock %}

web/pages/text.njk

@@ -0,0 +1,21 @@
+{% extends "templates/publishing.njk" %}
+
+{% block main %}
+	<header>
+		<h1>Nebulosa CSS</h1>
+		<h2>A showcase of text elements</h2>
+	</header>
+	<h1>Text elements</h1>
+
+	<h2>Regular paragraph</h2>
+	<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex expedita ullam blanditiis inventore molestiae perferendis iusto nulla quo sit porro, mollitia nobis recusandae repellendus eveniet, alias hic officiis sunt impedit?</p>
+
+	<h2>Blockquote</h2>
+	<p>
+		<blockquote>
+			Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga facere, ullam repudiandae perferendis facilis voluptatibus dolores sequi quam nihil harum veritatis rerum, molestias voluptates enim dolorum? Provident officia qui voluptatum.
+		</blockquote>
+	</p>
+
+
+{% endblock %}