diff --git a/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.automated_list.inc b/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.automated_list.inc
index 6450cf37e..69e0825b7 100644
--- a/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.automated_list.inc
+++ b/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.automated_list.inc
@@ -95,6 +95,46 @@ function _cs_generated_content_create_node_civictheme_page__variations__componen
       ],
     ],
 
+    // All. Snippet.
+    [
+      'title' => 'Page. Component. Automated list, All, View as Snippet, Unlimited, Title, Content, Above link, Below link, Both space, Background',
+      'no_sidebar' => TRUE,
+      'components' => [
+        [
+          'type' => 'automated_list',
+          'title' => 'Automated list title Light',
+          'content' => $helper::staticSentenceFieldValue(),
+          'list_type' => $helper::civicthemeAutomatedListType(),
+          'list_link_above' => $helper::staticLinkFieldValue(),
+          'list_link_below' => $helper::staticLinkFieldValue(),
+          'list_limit_type' => $helper::civicthemeAutomatedListLimitTypeUnlimited(),
+          'list_limit' => 0,
+          'list_column_count' => 1,
+          'list_item_view_as' => $helper::civicthemeSnippetType(),
+          'list_item_theme' => $helper::civicthemeThemeLight(),
+          'theme' => $helper::civicthemeThemeLight(),
+          'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
+          'background' => TRUE,
+        ],
+        [
+          'type' => 'automated_list',
+          'title' => 'Automated list title Dark',
+          'content' => $helper::staticSentenceFieldValue(),
+          'list_type' => $helper::civicthemeAutomatedListType(),
+          'list_link_above' => $helper::staticLinkFieldValue(),
+          'list_link_below' => $helper::staticLinkFieldValue(),
+          'list_limit_type' => $helper::civicthemeAutomatedListLimitTypeUnlimited(),
+          'list_limit' => 0,
+          'list_column_count' => 1,
+          'list_item_view_as' => $helper::civicthemeSnippetType(),
+          'list_item_theme' => $helper::civicthemeThemeDark(),
+          'theme' => $helper::civicthemeThemeDark(),
+          'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
+          'background' => TRUE,
+        ],
+      ],
+    ],
+
     // Page. Promo card.
     [
       'title' => 'Page. Component. Automated list, Light, Pages, View as Promo card, Light card, Unlimited, Title, Content, Above link, Below link, Both space, Background',
@@ -119,7 +159,6 @@ function _cs_generated_content_create_node_civictheme_page__variations__componen
         ],
       ],
     ],
-
     // Page. Navigation card.
     [
       'title' => 'Page. Component. Automated list, Light, Pages, View as Navigation card, Light card, Unlimited, Title, Content, Above link, Below link, Both space, Background',
@@ -144,6 +183,30 @@ function _cs_generated_content_create_node_civictheme_page__variations__componen
         ],
       ],
     ],
+    // Page. Snippet.
+    [
+      'title' => 'Page. Component. Automated list, Light, Pages, View as Snippet, Light card, Unlimited, Title, Content, Above link, Below link, Both space, Background',
+      'no_sidebar' => TRUE,
+      'components' => [
+        [
+          'type' => 'automated_list',
+          'title' => 'Automated list title',
+          'content' => $helper::staticSentenceFieldValue(),
+          'list_type' => $helper::civicthemeAutomatedListType(),
+          'list_link_above' => $helper::staticLinkFieldValue(),
+          'list_link_below' => $helper::staticLinkFieldValue(),
+          'list_content_type' => $helper::civicthemePageContentType(),
+          'list_limit_type' => $helper::civicthemeAutomatedListLimitTypeUnlimited(),
+          'list_limit' => 0,
+          'list_column_count' => 1,
+          'list_item_view_as' => $helper::civicthemeSnippetType(),
+          'list_item_theme' => $helper::civicthemeThemeLight(),
+          'theme' => $helper::civicthemeThemeLight(),
+          'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
+          'background' => TRUE,
+        ],
+      ],
+    ],
 
     // Event. Promo card.
     [
@@ -193,6 +256,30 @@ function _cs_generated_content_create_node_civictheme_page__variations__componen
         ],
       ],
     ],
+    // Event. Snippet.
+    [
+      'title' => 'Page. Component. Automated list, Light, Pages, View as Snippet, Light card, Unlimited, Title, Content, Above link, Below link, Both space, Background',
+      'no_sidebar' => TRUE,
+      'components' => [
+        [
+          'type' => 'automated_list',
+          'title' => 'Automated list title',
+          'content' => $helper::staticSentenceFieldValue(),
+          'list_type' => $helper::civicthemeAutomatedListType(),
+          'list_link_above' => $helper::staticLinkFieldValue(),
+          'list_link_below' => $helper::staticLinkFieldValue(),
+          'list_content_type' => $helper::civicthemeEventContentType(),
+          'list_limit_type' => $helper::civicthemeAutomatedListLimitTypeUnlimited(),
+          'list_limit' => 0,
+          'list_column_count' => 1,
+          'list_item_view_as' => $helper::civicthemeSnippetType(),
+          'list_item_theme' => $helper::civicthemeThemeLight(),
+          'theme' => $helper::civicthemeThemeLight(),
+          'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
+          'background' => TRUE,
+        ],
+      ],
+    ],
 
     // Limit.
     [
diff --git a/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.manual_list.inc b/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.manual_list.inc
index b05afb86c..8a24952ef 100644
--- a/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.manual_list.inc
+++ b/docroot/modules/custom/cs_generated_content/generated_content/node/civictheme_page_variations/component.manual_list.inc
@@ -17,11 +17,11 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
   $page = [
     'components' => [
       [
-        'title' => 'Light, Full width, 1 column, 1 card',
+        'title' => 'Promo card, Light, Full width, 1 column, 1 card',
         'theme' => $helper::civicthemeThemeLight(),
         'list_column_count' => 1,
         'type' => 'manual_list',
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -29,12 +29,12 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Light, Full width, 1 column, 1 card, fill width',
+        'title' => 'Promo card, Light, Full width, 1 column, 1 card, fill width',
         'theme' => $helper::civicthemeThemeLight(),
         'list_column_count' => 1,
         'list_fill_width' => TRUE,
         'type' => 'manual_list',
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -42,11 +42,11 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Light, Full width, 2 column, 3 cards',
+        'title' => 'Promo card, Light, Full width, 2 column, 3 cards',
         'theme' => $helper::civicthemeThemeLight(),
         'list_column_count' => 2,
         'type' => 'manual_list',
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -62,12 +62,12 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Light, Full width, 2 column, 3 cards, fill width',
+        'title' => 'Promo card, Light, Full width, 2 column, 3 cards, fill width',
         'theme' => $helper::civicthemeThemeLight(),
         'list_column_count' => 2,
         'list_fill_width' => TRUE,
         'type' => 'manual_list',
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -83,12 +83,12 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Light, Title, Content',
+        'title' => 'Promo card, Light, Title, Content',
         'theme' => $helper::civicthemeThemeLight(),
         'content' => $helper::staticSentence(8),
         'type' => 'manual_list',
         'list_column_count' => 2,
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -104,12 +104,12 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Dark, Title, Content',
+        'title' => 'Promo card, Dark, Title, Content',
         'theme' => $helper::civicthemeThemeDark(),
         'content' => $helper::staticSentenceFieldValue(8),
         'type' => 'manual_list',
         'list_column_count' => 2,
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -125,7 +125,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Light, BG, Title, Content, Before Link, After Link',
+        'title' => 'Promo card, Light, BG, Title, Content, Before Link, After Link',
         'theme' => $helper::civicthemeThemeLight(),
         'content' => $helper::staticSentenceFieldValue(8),
         'list_link_above' => $helper::staticLinkFieldValue(2),
@@ -133,7 +133,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         'background' => TRUE,
         'type' => 'manual_list',
         'list_column_count' => 2,
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -149,7 +149,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Dark, BG, Title, Content, Before Link, After Link',
+        'title' => 'Promo card, Dark, BG, Title, Content, Before Link, After Link',
         'theme' => $helper::civicthemeThemeDark(),
         'content' => $helper::staticSentenceFieldValue(8),
         'list_link_above' => $helper::staticLinkFieldValue(2),
@@ -157,7 +157,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         'background' => TRUE,
         'type' => 'manual_list',
         'list_column_count' => 2,
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -177,7 +177,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
       ],
 
       [
-        'title' => 'Light, BG, Title, Content, Before Link, After Link, Vertical Spacing',
+        'title' => 'Promo card, Light, BG, Title, Content, Before Link, After Link, Vertical Spacing',
         'theme' => $helper::civicthemeThemeLight(),
         'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
         'content' => $helper::staticSentenceFieldValue(8),
@@ -186,7 +186,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         'background' => TRUE,
         'type' => 'manual_list',
         'list_column_count' => 2,
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -202,7 +202,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         ],
       ],
       [
-        'title' => 'Dark, BG, Title, Content, Before Link, After Link, Vertical Spacing',
+        'title' => 'Promo card, Dark, BG, Title, Content, Before Link, After Link, Vertical Spacing',
         'theme' => $helper::civicthemeThemeDark(),
         'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
         'content' => $helper::staticSentenceFieldValue(8),
@@ -211,7 +211,7 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
         'background' => TRUE,
         'type' => 'manual_list',
         'list_column_count' => 2,
-        'cards' => [
+        'list_items' => [
           [
             'type' => 'civictheme_promo_card',
             'title' => $helper::staticSentence(3),
@@ -229,6 +229,66 @@ function _cs_generated_content_create_node_civictheme_page__variations__manual_l
           ],
         ],
       ],
+
+      [
+        'title' => 'Snippet, Light, BG, Title, Content, Before Link, After Link, Vertical Spacing',
+        'theme' => $helper::civicthemeThemeLight(),
+        'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
+        'content' => $helper::staticSentenceFieldValue(8),
+        'list_link_above' => $helper::staticLinkFieldValue(2),
+        'list_link_below' => $helper::staticLinkFieldValue(2),
+        'background' => TRUE,
+        'type' => 'manual_list',
+        'list_column_count' => 1,
+        'list_items' => [
+          [
+            'type' => 'civictheme_snippet',
+            'title' => $helper::staticSentence(3),
+            'summary' => $helper::staticPlainParagraph(),
+          ],
+          [
+            'type' => 'civictheme_snippet',
+            'title' => $helper::staticSentence(3),
+            'summary' => $helper::staticPlainParagraph(),
+          ],
+          [
+            'type' => 'civictheme_snippet',
+            'title' => $helper::staticSentence(3),
+            'summary' => $helper::staticPlainParagraph(),
+          ],
+        ],
+      ],
+      [
+        'title' => 'Snippet, Dark, BG, Title, Content, Before Link, After Link, Vertical Spacing',
+        'theme' => $helper::civicthemeThemeDark(),
+        'vertical_spacing' => $helper::civicthemeVerticalSpacingTypeBoth(),
+        'content' => $helper::staticSentenceFieldValue(8),
+        'list_link_above' => $helper::staticLinkFieldValue(2),
+        'list_link_below' => $helper::staticLinkFieldValue(2),
+        'background' => TRUE,
+        'type' => 'manual_list',
+        'list_column_count' => 1,
+        'list_items' => [
+          [
+            'type' => 'civictheme_snippet',
+            'title' => $helper::staticSentence(3),
+            'summary' => $helper::staticPlainParagraph(),
+            'theme' => $helper::civicthemeThemeDark(),
+          ],
+          [
+            'type' => 'civictheme_snippet',
+            'title' => $helper::staticSentence(3),
+            'summary' => $helper::staticPlainParagraph(),
+            'theme' => $helper::civicthemeThemeDark(),
+          ],
+          [
+            'type' => 'civictheme_snippet',
+            'title' => $helper::staticSentence(3),
+            'summary' => $helper::staticPlainParagraph(),
+            'theme' => $helper::civicthemeThemeDark(),
+          ],
+        ],
+      ],
     ],
   ];
 
diff --git a/docroot/modules/custom/cs_generated_content/src/CsGeneratedContentCivicthemeTrait.php b/docroot/modules/custom/cs_generated_content/src/CsGeneratedContentCivicthemeTrait.php
index 5fda881b9..077d41f47 100644
--- a/docroot/modules/custom/cs_generated_content/src/CsGeneratedContentCivicthemeTrait.php
+++ b/docroot/modules/custom/cs_generated_content/src/CsGeneratedContentCivicthemeTrait.php
@@ -74,6 +74,13 @@ public static function civicthemeNavigationCardType() {
     return 'civictheme_navigation_card';
   }
 
+  /**
+   * Snippet type name.
+   */
+  public static function civicthemeSnippetType() {
+    return 'civictheme_snippet';
+  }
+
   /**
    * Available theme names.
    */
@@ -764,9 +771,9 @@ public static function civicthemeParagraphManualListAttach($node, $field_name, $
       return NULL;
     }
 
-    if (!empty($options['cards']) && count($options['cards']) > 0) {
-      $cards = $options['cards'];
-      unset($options['cards']);
+    if (!empty($options['list_items']) && count($options['list_items']) > 0) {
+      $list_items = $options['list_items'];
+      unset($options['list_items']);
     }
 
     $paragraph = self::civicthemeParagraphAttach('civictheme_manual_list', $node, $field_name, $options);
@@ -776,12 +783,12 @@ public static function civicthemeParagraphManualListAttach($node, $field_name, $
     }
 
     // Slider slide.
-    if (!empty($cards)) {
-      foreach ($cards as $card_options) {
-        if (!empty($card_options['type'])) {
-          $type = $card_options['type'];
-          unset($card_options['type']);
-          $card = self::civicthemeParagraphAttach($type, $paragraph, 'field_c_p_list_items', $card_options, TRUE);
+    if (!empty($list_items)) {
+      foreach ($list_items as $list_item_options) {
+        if (!empty($list_item_options['type'])) {
+          $type = $list_item_options['type'];
+          unset($list_item_options['type']);
+          $card = self::civicthemeParagraphAttach($type, $paragraph, 'field_c_p_list_items', $list_item_options, TRUE);
           if (!empty($card)) {
             $paragraph->field_c_p_list_items->appendItem($card);
           }
diff --git a/docroot/themes/contrib/civictheme/civictheme.info.yml b/docroot/themes/contrib/civictheme/civictheme.info.yml
index c1330fe61..4d4de216e 100644
--- a/docroot/themes/contrib/civictheme/civictheme.info.yml
+++ b/docroot/themes/contrib/civictheme/civictheme.info.yml
@@ -159,6 +159,8 @@ config_devel:
     - core.entity_form_display.paragraph.civictheme_slider.default
     - core.entity_form_display.paragraph.civictheme_slider_slide.default
     - core.entity_form_display.paragraph.civictheme_slider_slide_ref.default
+    - core.entity_form_display.paragraph.civictheme_snippet.default
+    - core.entity_form_display.paragraph.civictheme_snippet_ref.default
     - core.entity_form_display.paragraph.civictheme_social_icon.default
     - core.entity_form_display.paragraph.civictheme_subject_card.default
     - core.entity_form_display.paragraph.civictheme_subject_card_ref.default
@@ -218,6 +220,8 @@ config_devel:
     - core.entity_view_display.paragraph.civictheme_slider.default
     - core.entity_view_display.paragraph.civictheme_slider_slide.default
     - core.entity_view_display.paragraph.civictheme_slider_slide_ref.default
+    - core.entity_view_display.paragraph.civictheme_snippet.default
+    - core.entity_view_display.paragraph.civictheme_snippet_ref.default
     - core.entity_view_display.paragraph.civictheme_social_icon.default
     - core.entity_view_display.paragraph.civictheme_subject_card.default
     - core.entity_view_display.paragraph.civictheme_subject_card_ref.default
@@ -227,6 +231,7 @@ config_devel:
     - core.entity_view_mode.node.civictheme_navigation_card
     - core.entity_view_mode.node.civictheme_promo_card
     - core.entity_view_mode.node.civictheme_slider_slide
+    - core.entity_view_mode.node.civictheme_snippet
     - editor.editor.civictheme_rich_text
     - field.field.block_content.civictheme_banner.field_c_b_background_image
     - field.field.block_content.civictheme_banner.field_c_b_banner_blend_mode
@@ -429,6 +434,13 @@ config_devel:
     - field.field.paragraph.civictheme_slider_slide_ref.field_c_p_link_text
     - field.field.paragraph.civictheme_slider_slide_ref.field_c_p_reference
     - field.field.paragraph.civictheme_slider_slide_ref.field_c_p_theme
+    - field.field.paragraph.civictheme_snippet.field_c_p_link
+    - field.field.paragraph.civictheme_snippet.field_c_p_summary
+    - field.field.paragraph.civictheme_snippet.field_c_p_theme
+    - field.field.paragraph.civictheme_snippet.field_c_p_title
+    - field.field.paragraph.civictheme_snippet.field_c_p_topics
+    - field.field.paragraph.civictheme_snippet_ref.field_c_p_reference
+    - field.field.paragraph.civictheme_snippet_ref.field_c_p_theme
     - field.field.paragraph.civictheme_social_icon.field_c_p_icon
     - field.field.paragraph.civictheme_social_icon.field_c_p_link
     - field.field.paragraph.civictheme_subject_card.field_c_p_image
@@ -582,6 +594,8 @@ config_devel:
     - paragraphs.paragraphs_type.civictheme_slider
     - paragraphs.paragraphs_type.civictheme_slider_slide
     - paragraphs.paragraphs_type.civictheme_slider_slide_ref
+    - paragraphs.paragraphs_type.civictheme_snippet
+    - paragraphs.paragraphs_type.civictheme_snippet_ref
     - paragraphs.paragraphs_type.civictheme_social_icon
     - paragraphs.paragraphs_type.civictheme_subject_card
     - paragraphs.paragraphs_type.civictheme_subject_card_ref
diff --git a/docroot/themes/contrib/civictheme/civictheme.theme b/docroot/themes/contrib/civictheme/civictheme.theme
index b6eba1ba3..d8e9324d5 100644
--- a/docroot/themes/contrib/civictheme/civictheme.theme
+++ b/docroot/themes/contrib/civictheme/civictheme.theme
@@ -44,6 +44,7 @@ require_once 'includes/system_main_block.inc';
 require_once 'includes/site_section.inc';
 require_once 'includes/skip_link.inc';
 require_once 'includes/slider.inc';
+require_once 'includes/snippet.inc';
 require_once 'includes/social_links.inc';
 require_once 'includes/system_branding.inc';
 require_once 'includes/table.inc';
diff --git a/docroot/themes/contrib/civictheme/config/install/core.entity_form_display.paragraph.civictheme_snippet.default.yml b/docroot/themes/contrib/civictheme/config/install/core.entity_form_display.paragraph.civictheme_snippet.default.yml
new file mode 100644
index 000000000..cd0ea4567
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/core.entity_form_display.paragraph.civictheme_snippet.default.yml
@@ -0,0 +1,60 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.field.paragraph.civictheme_snippet.field_c_p_link
+    - field.field.paragraph.civictheme_snippet.field_c_p_summary
+    - field.field.paragraph.civictheme_snippet.field_c_p_theme
+    - field.field.paragraph.civictheme_snippet.field_c_p_title
+    - field.field.paragraph.civictheme_snippet.field_c_p_topics
+    - paragraphs.paragraphs_type.civictheme_snippet
+  module:
+    - link
+id: paragraph.civictheme_snippet.default
+targetEntityType: paragraph
+bundle: civictheme_snippet
+mode: default
+content:
+  field_c_p_link:
+    type: link_default
+    weight: 3
+    region: content
+    settings:
+      placeholder_url: ''
+      placeholder_title: ''
+    third_party_settings: {  }
+  field_c_p_summary:
+    type: string_textarea
+    weight: 1
+    region: content
+    settings:
+      rows: 5
+      placeholder: ''
+    third_party_settings: {  }
+  field_c_p_theme:
+    type: options_buttons
+    weight: 4
+    region: content
+    settings: {  }
+    third_party_settings: {  }
+  field_c_p_title:
+    type: string_textfield
+    weight: 0
+    region: content
+    settings:
+      size: 60
+      placeholder: ''
+    third_party_settings: {  }
+  field_c_p_topics:
+    type: entity_reference_autocomplete
+    weight: 2
+    region: content
+    settings:
+      match_operator: CONTAINS
+      match_limit: 10
+      size: 60
+      placeholder: ''
+    third_party_settings: {  }
+hidden:
+  created: true
+  status: true
diff --git a/docroot/themes/contrib/civictheme/config/install/core.entity_form_display.paragraph.civictheme_snippet_ref.default.yml b/docroot/themes/contrib/civictheme/config/install/core.entity_form_display.paragraph.civictheme_snippet_ref.default.yml
new file mode 100644
index 000000000..e1f294ee8
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/core.entity_form_display.paragraph.civictheme_snippet_ref.default.yml
@@ -0,0 +1,31 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.field.paragraph.civictheme_snippet_ref.field_c_p_reference
+    - field.field.paragraph.civictheme_snippet_ref.field_c_p_theme
+    - paragraphs.paragraphs_type.civictheme_snippet_ref
+id: paragraph.civictheme_snippet_ref.default
+targetEntityType: paragraph
+bundle: civictheme_snippet_ref
+mode: default
+content:
+  field_c_p_reference:
+    type: entity_reference_autocomplete
+    weight: 0
+    region: content
+    settings:
+      match_operator: CONTAINS
+      match_limit: 10
+      size: 60
+      placeholder: ''
+    third_party_settings: {  }
+  field_c_p_theme:
+    type: options_buttons
+    weight: 1
+    region: content
+    settings: {  }
+    third_party_settings: {  }
+hidden:
+  created: true
+  status: true
diff --git a/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_navigation_card_ref.default.yml b/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_navigation_card_ref.default.yml
index 5b8e0680b..ca742d658 100644
--- a/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_navigation_card_ref.default.yml
+++ b/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_navigation_card_ref.default.yml
@@ -13,19 +13,19 @@ bundle: civictheme_navigation_card_ref
 mode: default
 content:
   field_c_p_reference:
-    weight: 1
+    type: entity_reference_entity_view
     label: hidden
     settings:
-      view_mode: civictheme_navigation_card
+      view_mode: civictheme_snippet
       link: false
     third_party_settings: {  }
-    type: entity_reference_entity_view
+    weight: 1
     region: content
   field_c_p_theme:
-    weight: 0
+    type: list_default
     label: hidden
     settings: {  }
     third_party_settings: {  }
-    type: list_default
+    weight: 0
     region: content
 hidden: {  }
diff --git a/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_snippet.default.yml b/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_snippet.default.yml
new file mode 100644
index 000000000..aa26861f6
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_snippet.default.yml
@@ -0,0 +1,61 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.field.paragraph.civictheme_snippet.field_c_p_link
+    - field.field.paragraph.civictheme_snippet.field_c_p_summary
+    - field.field.paragraph.civictheme_snippet.field_c_p_theme
+    - field.field.paragraph.civictheme_snippet.field_c_p_title
+    - field.field.paragraph.civictheme_snippet.field_c_p_topics
+    - paragraphs.paragraphs_type.civictheme_snippet
+  module:
+    - link
+    - options
+id: paragraph.civictheme_snippet.default
+targetEntityType: paragraph
+bundle: civictheme_snippet
+mode: default
+content:
+  field_c_p_link:
+    type: link
+    label: hidden
+    settings:
+      trim_length: 80
+      url_only: false
+      url_plain: false
+      rel: ''
+      target: ''
+    third_party_settings: {  }
+    weight: 3
+    region: content
+  field_c_p_summary:
+    type: basic_string
+    label: hidden
+    settings: {  }
+    third_party_settings: {  }
+    weight: 2
+    region: content
+  field_c_p_theme:
+    type: list_default
+    label: above
+    settings: {  }
+    third_party_settings: {  }
+    weight: 0
+    region: content
+  field_c_p_title:
+    type: string
+    label: hidden
+    settings:
+      link_to_entity: false
+    third_party_settings: {  }
+    weight: 1
+    region: content
+  field_c_p_topics:
+    type: entity_reference_label
+    label: hidden
+    settings:
+      link: true
+    third_party_settings: {  }
+    weight: 4
+    region: content
+hidden: {  }
diff --git a/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_snippet_ref.default.yml b/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_snippet_ref.default.yml
new file mode 100644
index 000000000..89f2c387c
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/core.entity_view_display.paragraph.civictheme_snippet_ref.default.yml
@@ -0,0 +1,31 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.field.paragraph.civictheme_snippet_ref.field_c_p_reference
+    - field.field.paragraph.civictheme_snippet_ref.field_c_p_theme
+    - paragraphs.paragraphs_type.civictheme_snippet_ref
+  module:
+    - options
+id: paragraph.civictheme_snippet_ref.default
+targetEntityType: paragraph
+bundle: civictheme_snippet_ref
+mode: default
+content:
+  field_c_p_reference:
+    type: entity_reference_entity_view
+    label: hidden
+    settings:
+      view_mode: default
+      link: false
+    third_party_settings: {  }
+    weight: 1
+    region: content
+  field_c_p_theme:
+    type: list_default
+    label: hidden
+    settings: {  }
+    third_party_settings: {  }
+    weight: 0
+    region: content
+hidden: {  }
diff --git a/docroot/themes/contrib/civictheme/config/install/core.entity_view_mode.node.civictheme_snippet.yml b/docroot/themes/contrib/civictheme/config/install/core.entity_view_mode.node.civictheme_snippet.yml
new file mode 100644
index 000000000..5379c1796
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/core.entity_view_mode.node.civictheme_snippet.yml
@@ -0,0 +1,9 @@
+langcode: en
+status: true
+dependencies:
+  module:
+    - node
+id: node.civictheme_snippet
+label: Snippet
+targetEntityType: node
+cache: true
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_manual_list.field_c_p_list_items.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_manual_list.field_c_p_list_items.yml
index 406298848..141b2d72a 100644
--- a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_manual_list.field_c_p_list_items.yml
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_manual_list.field_c_p_list_items.yml
@@ -12,6 +12,8 @@ dependencies:
     - paragraphs.paragraphs_type.civictheme_promo_card_ref
     - paragraphs.paragraphs_type.civictheme_publication_card
     - paragraphs.paragraphs_type.civictheme_service_card
+    - paragraphs.paragraphs_type.civictheme_snippet
+    - paragraphs.paragraphs_type.civictheme_snippet_ref
     - paragraphs.paragraphs_type.civictheme_subject_card
     - paragraphs.paragraphs_type.civictheme_subject_card_ref
   module:
@@ -38,89 +40,100 @@ settings:
       civictheme_promo_card_ref: civictheme_promo_card_ref
       civictheme_publication_card: civictheme_publication_card
       civictheme_service_card: civictheme_service_card
+      civictheme_snippet: civictheme_snippet
+      civictheme_snippet_ref: civictheme_snippet_ref
       civictheme_subject_card: civictheme_subject_card
       civictheme_subject_card_ref: civictheme_subject_card_ref
     negate: 0
     target_bundles_drag_drop:
       civictheme_accordion:
-        weight: 31
+        weight: -61
         enabled: false
       civictheme_accordion_panel:
-        weight: 32
+        weight: -60
         enabled: false
       civictheme_attachment:
-        weight: 33
+        weight: -59
         enabled: false
       civictheme_automated_list:
-        weight: 34
+        weight: -58
         enabled: false
       civictheme_callout:
-        weight: 35
+        weight: -57
         enabled: false
-      civictheme_manual_list:
-        weight: 41
+      civictheme_campaign:
+        weight: -56
         enabled: false
       civictheme_content:
-        weight: 37
+        weight: -55
         enabled: false
       civictheme_event_card:
-        weight: 38
+        weight: -54
         enabled: true
       civictheme_event_card_ref:
-        weight: 39
+        weight: -53
         enabled: true
       civictheme_iframe:
-        weight: 40
+        weight: -52
+        enabled: false
+      civictheme_manual_list:
+        weight: -51
         enabled: false
       civictheme_map:
-        weight: 42
+        weight: -50
         enabled: false
       civictheme_navigation_card:
-        weight: 43
+        weight: -49
         enabled: true
       civictheme_navigation_card_ref:
-        weight: 44
+        weight: -48
         enabled: true
       civictheme_next_step:
-        weight: 45
+        weight: -47
         enabled: false
       civictheme_promo:
-        weight: 46
+        weight: -46
         enabled: false
       civictheme_promo_card:
-        weight: 47
+        weight: -45
         enabled: true
       civictheme_promo_card_ref:
-        weight: 48
+        weight: -44
         enabled: true
       civictheme_publication_card:
-        weight: 49
+        weight: -43
         enabled: true
       civictheme_quote:
-        weight: 51
+        weight: -42
         enabled: false
       civictheme_service_card:
-        weight: 52
+        weight: -41
         enabled: true
       civictheme_slider:
-        weight: 53
+        weight: -40
         enabled: false
       civictheme_slider_slide:
-        weight: 54
+        weight: -39
         enabled: false
       civictheme_slider_slide_ref:
-        weight: 55
+        weight: -38
         enabled: false
+      civictheme_snippet:
+        weight: -37
+        enabled: true
+      civictheme_snippet_ref:
+        weight: -36
+        enabled: true
       civictheme_social_icon:
-        weight: 56
+        weight: -35
         enabled: false
       civictheme_subject_card:
-        weight: 57
+        weight: -34
         enabled: true
       civictheme_subject_card_ref:
-        weight: 58
+        weight: -33
         enabled: true
       civictheme_webform:
-        weight: 60
+        weight: -32
         enabled: false
 field_type: entity_reference_revisions
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_link.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_link.yml
new file mode 100644
index 000000000..999f30f26
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_link.yml
@@ -0,0 +1,22 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.paragraph.field_c_p_link
+    - paragraphs.paragraphs_type.civictheme_snippet
+  module:
+    - link
+id: paragraph.civictheme_snippet.field_c_p_link
+field_name: field_c_p_link
+entity_type: paragraph
+bundle: civictheme_snippet
+label: Link
+description: ''
+required: false
+translatable: true
+default_value: {  }
+default_value_callback: ''
+settings:
+  title: 0
+  link_type: 17
+field_type: link
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_summary.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_summary.yml
new file mode 100644
index 000000000..56343d5b1
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_summary.yml
@@ -0,0 +1,18 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.paragraph.field_c_p_summary
+    - paragraphs.paragraphs_type.civictheme_snippet
+id: paragraph.civictheme_snippet.field_c_p_summary
+field_name: field_c_p_summary
+entity_type: paragraph
+bundle: civictheme_snippet
+label: Summary
+description: ''
+required: false
+translatable: true
+default_value: {  }
+default_value_callback: ''
+settings: {  }
+field_type: string_long
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_theme.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_theme.yml
new file mode 100644
index 000000000..a3e543c22
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_theme.yml
@@ -0,0 +1,22 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.paragraph.field_c_p_theme
+    - paragraphs.paragraphs_type.civictheme_snippet
+  module:
+    - options
+id: paragraph.civictheme_snippet.field_c_p_theme
+field_name: field_c_p_theme
+entity_type: paragraph
+bundle: civictheme_snippet
+label: Theme
+description: ''
+required: true
+translatable: true
+default_value:
+  -
+    value: light
+default_value_callback: ''
+settings: {  }
+field_type: list_string
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_title.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_title.yml
new file mode 100644
index 000000000..d58c5c816
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_title.yml
@@ -0,0 +1,18 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.paragraph.field_c_p_title
+    - paragraphs.paragraphs_type.civictheme_snippet
+id: paragraph.civictheme_snippet.field_c_p_title
+field_name: field_c_p_title
+entity_type: paragraph
+bundle: civictheme_snippet
+label: Title
+description: ''
+required: true
+translatable: true
+default_value: {  }
+default_value_callback: ''
+settings: {  }
+field_type: string
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_topics.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_topics.yml
new file mode 100644
index 000000000..416f27d7b
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet.field_c_p_topics.yml
@@ -0,0 +1,28 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.paragraph.field_c_p_topics
+    - paragraphs.paragraphs_type.civictheme_snippet
+    - taxonomy.vocabulary.civictheme_topics
+id: paragraph.civictheme_snippet.field_c_p_topics
+field_name: field_c_p_topics
+entity_type: paragraph
+bundle: civictheme_snippet
+label: Topics
+description: ''
+required: false
+translatable: true
+default_value: {  }
+default_value_callback: ''
+settings:
+  handler: 'default:taxonomy_term'
+  handler_settings:
+    target_bundles:
+      civictheme_topics: civictheme_topics
+    sort:
+      field: name
+      direction: asc
+    auto_create: false
+    auto_create_bundle: ''
+field_type: entity_reference
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet_ref.field_c_p_reference.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet_ref.field_c_p_reference.yml
new file mode 100644
index 000000000..5e8f5c89f
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet_ref.field_c_p_reference.yml
@@ -0,0 +1,30 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.paragraph.field_c_p_reference
+    - node.type.civictheme_event
+    - node.type.civictheme_page
+    - paragraphs.paragraphs_type.civictheme_snippet_ref
+id: paragraph.civictheme_snippet_ref.field_c_p_reference
+field_name: field_c_p_reference
+entity_type: paragraph
+bundle: civictheme_snippet_ref
+label: Reference
+description: ''
+required: true
+translatable: true
+default_value: {  }
+default_value_callback: ''
+settings:
+  handler: 'default:node'
+  handler_settings:
+    target_bundles:
+      civictheme_event: civictheme_event
+      civictheme_page: civictheme_page
+    sort:
+      field: _none
+      direction: ASC
+    auto_create: false
+    auto_create_bundle: civictheme_event
+field_type: entity_reference
diff --git a/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet_ref.field_c_p_theme.yml b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet_ref.field_c_p_theme.yml
new file mode 100644
index 000000000..62b997874
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/field.field.paragraph.civictheme_snippet_ref.field_c_p_theme.yml
@@ -0,0 +1,22 @@
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.paragraph.field_c_p_theme
+    - paragraphs.paragraphs_type.civictheme_snippet_ref
+  module:
+    - options
+id: paragraph.civictheme_snippet_ref.field_c_p_theme
+field_name: field_c_p_theme
+entity_type: paragraph
+bundle: civictheme_snippet_ref
+label: Theme
+description: ''
+required: true
+translatable: true
+default_value:
+  -
+    value: light
+default_value_callback: ''
+settings: {  }
+field_type: list_string
diff --git a/docroot/themes/contrib/civictheme/config/install/field.storage.paragraph.field_c_p_list_item_view_as.yml b/docroot/themes/contrib/civictheme/config/install/field.storage.paragraph.field_c_p_list_item_view_as.yml
index 92b718f55..20f1a8549 100644
--- a/docroot/themes/contrib/civictheme/config/install/field.storage.paragraph.field_c_p_list_item_view_as.yml
+++ b/docroot/themes/contrib/civictheme/config/install/field.storage.paragraph.field_c_p_list_item_view_as.yml
@@ -16,6 +16,9 @@ settings:
     -
       value: civictheme_navigation_card
       label: 'Navigation card'
+    -
+      value: civictheme_snippet
+      label: Snippet
   allowed_values_function: ''
 module: options
 locked: false
diff --git a/docroot/themes/contrib/civictheme/config/install/paragraphs.paragraphs_type.civictheme_snippet.yml b/docroot/themes/contrib/civictheme/config/install/paragraphs.paragraphs_type.civictheme_snippet.yml
new file mode 100644
index 000000000..1bf91ede5
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/paragraphs.paragraphs_type.civictheme_snippet.yml
@@ -0,0 +1,9 @@
+langcode: en
+status: true
+dependencies: {  }
+id: civictheme_snippet
+label: Snippet
+icon_uuid: null
+icon_default: null
+description: ''
+behavior_plugins: {  }
diff --git a/docroot/themes/contrib/civictheme/config/install/paragraphs.paragraphs_type.civictheme_snippet_ref.yml b/docroot/themes/contrib/civictheme/config/install/paragraphs.paragraphs_type.civictheme_snippet_ref.yml
new file mode 100644
index 000000000..09158f8ec
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/config/install/paragraphs.paragraphs_type.civictheme_snippet_ref.yml
@@ -0,0 +1,9 @@
+langcode: en
+status: true
+dependencies: {  }
+id: civictheme_snippet_ref
+label: 'Snippet reference'
+icon_uuid: null
+icon_default: null
+description: ''
+behavior_plugins: {  }
diff --git a/docroot/themes/contrib/civictheme/includes/paragraphs.inc b/docroot/themes/contrib/civictheme/includes/paragraphs.inc
index 738c28e03..aa8729d34 100644
--- a/docroot/themes/contrib/civictheme/includes/paragraphs.inc
+++ b/docroot/themes/contrib/civictheme/includes/paragraphs.inc
@@ -226,14 +226,14 @@ function _civictheme_preprocess_paragraph__paragraph_field__summary(&$variables)
 /**
  * Pre-process for Summary node field.
  */
-function _civictheme_preprocess_paragraph__node_field__summary(&$variables, $card_type = NULL) {
+function _civictheme_preprocess_paragraph__node_field__summary(&$variables, $bundle = NULL) {
   $node = $variables['node'] ?? civictheme_get_field_value($variables['paragraph'], 'field_c_p_reference', TRUE);
   if ($node) {
     $summary = civictheme_get_field_value($node, 'field_c_n_summary', TRUE);
     if (!empty($summary)) {
       $length = CivicthemeConstants::CARD_SUMMARY_DEFAULT_LENGTH;
 
-      $card_name = _civictheme_get_card_name_from_bundle($card_type ?? $variables['paragraph']->bundle() ?? 'none');
+      $card_name = _civictheme_get_card_name_from_bundle($bundle ?? (!empty($variables['paragraph']) && $variables['paragraph']->bundle()) ?? 'none');
       if ($card_name) {
         $length = civictheme_get_theme_config_manager()->loadForComponent($card_name, 'summary_length', CivicthemeConstants::CARD_SUMMARY_DEFAULT_LENGTH);
       }
diff --git a/docroot/themes/contrib/civictheme/includes/snippet.inc b/docroot/themes/contrib/civictheme/includes/snippet.inc
new file mode 100644
index 000000000..1d01d6115
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/includes/snippet.inc
@@ -0,0 +1,44 @@
+<?php
+
+/**
+ * @file
+ * Snippet theme alterations.
+ */
+
+use Drupal\civictheme\CivicthemeConstants;
+
+/**
+ * Implements template_preprocess_paragraph().
+ */
+function civictheme_preprocess_paragraph__civictheme_snippet(&$variables) {
+  _civictheme_preprocess_paragraph__paragraph_field__title($variables);
+  _civictheme_preprocess_paragraph__paragraph_field__summary($variables);
+  _civictheme_preprocess_paragraph__paragraph_field__link($variables);
+  _civictheme_preprocess_paragraph__paragraph_field__topics($variables);
+  _civictheme_preprocess_paragraph__paragraph_field__theme($variables);
+}
+
+/**
+ * Implements template_preprocess_paragraph().
+ */
+function civictheme_preprocess_paragraph__civictheme_snippet_ref(&$variables) {
+  _civictheme_preprocess_paragraph__node_field__title($variables);
+  _civictheme_preprocess_paragraph__node_field__summary($variables);
+  _civictheme_preprocess_paragraph__node_field__link($variables);
+  _civictheme_preprocess_paragraph__node_field__topics($variables);
+  _civictheme_preprocess_paragraph__paragraph_field__theme($variables);
+}
+
+/**
+ * Implements template_preprocess_node().
+ *
+ * @SuppressWarnings(PHPMD.ElseExpression)
+ */
+function _civictheme_preprocess_node__civictheme_snippet(&$variables) {
+  _civictheme_preprocess_paragraph__node_field__title($variables);
+  _civictheme_preprocess_paragraph__node_field__summary($variables);
+  _civictheme_preprocess_paragraph__node_field__link($variables);
+  _civictheme_preprocess_paragraph__node_field__topics($variables);
+  // @see civictheme_preprocess_views_view_grid()
+  $variables['theme'] = $variables['node']->component_theme ?? CivicthemeConstants::THEME_LIGHT;
+}
diff --git a/docroot/themes/contrib/civictheme/templates/content/node--civictheme-event--civictheme-snippet.html.twig b/docroot/themes/contrib/civictheme/templates/content/node--civictheme-event--civictheme-snippet.html.twig
new file mode 100644
index 000000000..63899b80c
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/templates/content/node--civictheme-event--civictheme-snippet.html.twig
@@ -0,0 +1,7 @@
+{#
+/**
+ * @file
+ * CivicTheme implementation to display an Event node as a Snippet.
+ */
+#}
+{% include "@molecules/snippet/snippet.twig" %}
diff --git a/docroot/themes/contrib/civictheme/templates/content/node--civictheme-page--civictheme-snippet.html.twig b/docroot/themes/contrib/civictheme/templates/content/node--civictheme-page--civictheme-snippet.html.twig
new file mode 100644
index 000000000..574061fda
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/templates/content/node--civictheme-page--civictheme-snippet.html.twig
@@ -0,0 +1,7 @@
+{#
+/**
+ * @file
+ * CivicTheme implementation to display a Page node as a Snippet.
+ */
+#}
+{% include "@molecules/snippet/snippet.twig" %}
diff --git a/docroot/themes/contrib/civictheme/templates/paragraphs/paragraph--civictheme-snippet-ref.html.twig b/docroot/themes/contrib/civictheme/templates/paragraphs/paragraph--civictheme-snippet-ref.html.twig
new file mode 100644
index 000000000..37dd0342d
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/templates/paragraphs/paragraph--civictheme-snippet-ref.html.twig
@@ -0,0 +1,7 @@
+{#
+/**
+ * @file
+ * CivicTheme implementation to display a Snippet reference.
+ */
+#}
+{% include '@molecules/snippet/snippet.twig' %}
diff --git a/docroot/themes/contrib/civictheme/templates/paragraphs/paragraph--civictheme-snippet.html.twig b/docroot/themes/contrib/civictheme/templates/paragraphs/paragraph--civictheme-snippet.html.twig
new file mode 100644
index 000000000..48baeff81
--- /dev/null
+++ b/docroot/themes/contrib/civictheme/templates/paragraphs/paragraph--civictheme-snippet.html.twig
@@ -0,0 +1,7 @@
+{#
+/**
+ * @file
+ * CivicTheme implementation to display a Snippet.
+ */
+#}
+{% include '@molecules/snippet/snippet.twig' %}
diff --git a/tests/behat/features/paragraph.civictheme_snippet.fields.feature b/tests/behat/features/paragraph.civictheme_snippet.fields.feature
new file mode 100644
index 000000000..7c2b7c0d8
--- /dev/null
+++ b/tests/behat/features/paragraph.civictheme_snippet.fields.feature
@@ -0,0 +1,28 @@
+@p0 @civictheme @civictheme_snippet
+Feature: Snippet fields
+
+  @api
+  Scenario: Fields appear as expected
+    Given I am logged in as a user with the "Site Administrator" role
+    When I visit "node/add/civictheme_page"
+    And I fill in "Title" with "[TEST] Page fields"
+    When I press "Add Manual list"
+    And I press "Add Snippet"
+
+    Then I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_title][0][value]']" element
+    And I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_title][0][value]'].required" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_title][0][value]'][disabled]" element
+
+    And I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_summary][0][value]']" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_summary][0][value]'].required" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_summary][0][value]'][disabled]" element
+
+    And I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_link][0][uri]']" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_link][0][uri]'].required" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_link][0][uri]'][disabled]" element
+
+    And I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_topics][0][target_id]']" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_topics][0][target_id]'].required" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_topics][0][target_id]'][disabled]" element
+
+    And I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_theme]']" element
diff --git a/tests/behat/features/paragraph.civictheme_snippet.render.feature b/tests/behat/features/paragraph.civictheme_snippet.render.feature
new file mode 100644
index 000000000..0810c7e20
--- /dev/null
+++ b/tests/behat/features/paragraph.civictheme_snippet.render.feature
@@ -0,0 +1,57 @@
+@p1 @civictheme @civictheme_snippet
+Feature: Snippet render
+
+  Background:
+    Given "civictheme_page" content:
+      | title                     | status |
+      | [TEST] Page Snippets test | 1      |
+
+    And "civictheme_topics" terms:
+      | name           |
+      | [TEST] Topic 1 |
+      | [TEST] Topic 2 |
+      | [TEST] Topic 3 |
+
+  @api
+  Scenario: CivicTheme page content type page can be viewed by anonymous with Snippets
+    Given I am an anonymous user
+    And "field_c_n_components" in "civictheme_page" "node" with "title" of "[TEST] Page Snippets test" has "civictheme_manual_list" paragraph:
+      | field_c_p_title             | [TEST] Snippet list                           |
+      | field_c_p_list_column_count | 4                                             |
+      | field_c_p_list_link_above   | 0: View all snippets - 1: https://example.com |
+      | field_c_p_list_fill_width   | 0                                             |
+    And "field_c_p_list_items" in "civictheme_manual_list" "paragraph" with "field_c_p_title" of "[TEST] Snippet list" has "civictheme_snippet" paragraph:
+      | field_c_p_title   | Snippet title 1                       |
+      | field_c_p_summary | Summary text  1                       |
+      | field_c_p_link    | 0: Test link - 1: https://example.com |
+      | field_c_p_topics  | [TEST] Topic 1                        |
+      | field_c_p_theme   | light                                 |
+    And "field_c_p_list_items" in "civictheme_manual_list" "paragraph" with "field_c_p_title" of "[TEST] Snippet list" has "civictheme_snippet" paragraph:
+      | field_c_p_title   | Snippet title 2                       |
+      | field_c_p_summary | Summary text 2                        |
+      | field_c_p_link    | 0: Test link - 1: https://example.com |
+      | field_c_p_topics  | [TEST] Topic 2, [TEST] Topic 3        |
+      | field_c_p_theme   | dark                                  |
+    And "field_c_p_list_items" in "civictheme_manual_list" "paragraph" with "field_c_p_title" of "[TEST] Snippet list" has "civictheme_snippet" paragraph:
+      | field_c_p_title   | Snippet title 3                       |
+      | field_c_p_summary | Summary text 3                        |
+      | field_c_p_link    | 0: Test link - 1: https://example.com |
+      | field_c_p_theme   | dark                                  |
+    And "field_c_p_list_items" in "civictheme_manual_list" "paragraph" with "field_c_p_title" of "[TEST] Snippet list" has "civictheme_snippet" paragraph:
+      | field_c_p_title | Snippet title 4                       |
+      | field_c_p_link  | 0: Test link - 1: https://example.com |
+      | field_c_p_theme | dark                                  |
+
+    When I visit "civictheme_page" "[TEST] Page Snippets test"
+    And I should see the text "[TEST] Snippet list"
+    Then I should see the link "View all snippets" with "https://example.com" in '.ct-list'
+    And I should see 4 ".ct-snippet" elements
+    And I should see 4 ".ct-snippet__title" elements
+    And I should see 3 ".ct-snippet__summary" elements
+    And I should see the text "Snippet title 1"
+    And I should see the text "Snippet title 2"
+    And I should see the text "Snippet title 3"
+    And I should see the text "Snippet title 4"
+    And I should see the text "[TEST] Topic 1"
+    And I should see the text "[TEST] Topic 2"
+    And I should see the text "[TEST] Topic 3"
diff --git a/tests/behat/features/paragraph.civictheme_snippet_ref.fields.feature b/tests/behat/features/paragraph.civictheme_snippet_ref.fields.feature
new file mode 100644
index 000000000..6a499cb8f
--- /dev/null
+++ b/tests/behat/features/paragraph.civictheme_snippet_ref.fields.feature
@@ -0,0 +1,16 @@
+@p0 @civictheme @civictheme_snippet_ref
+Feature: Snippet reference fields
+
+  @api
+  Scenario: Fields appear as expected
+    Given I am logged in as a user with the "Site Administrator" role
+    When I visit "node/add/civictheme_page"
+    And I fill in "Title" with "[TEST] Page fields"
+    When I press "Add Manual list"
+    And I press "Add Snippet reference"
+
+    Then I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_reference][0][target_id]']" element
+    And I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_reference][0][target_id]'].required" element
+    And I should not see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_reference][0][target_id]'][disabled]" element
+
+    And I should see an "[name='field_c_n_components[0][subform][field_c_p_list_items][0][subform][field_c_p_theme]']" element
diff --git a/tests/behat/features/paragraph.civictheme_snippet_ref.render.feature b/tests/behat/features/paragraph.civictheme_snippet_ref.render.feature
new file mode 100644
index 000000000..69ac8de32
--- /dev/null
+++ b/tests/behat/features/paragraph.civictheme_snippet_ref.render.feature
@@ -0,0 +1,47 @@
+@p0 @civictheme @civictheme_snippet_ref
+Feature: Navigation reference card render
+
+  Background:
+    Given "civictheme_topics" terms:
+      | name           |
+      | [TEST] Topic 1 |
+      | [TEST] Topic 2 |
+      | [TEST] Topic 3 |
+
+    And "civictheme_page" content:
+      | title                      | status | field_c_n_summary | field_c_n_topics               |
+      | [TEST] Page with container | 1      |                   |                                |
+      | [TEST] Referenced Page 1   | 1      | Summary 1         | [TEST] Topic 1                 |
+      | [TEST] Referenced Page 2   | 1      | Summary 2         | [TEST] Topic 2, [TEST] Topic 3 |
+
+  @api
+  Scenario: Anonymous user can view Navigation reference card
+    Given I am an anonymous user
+    And "field_c_n_components" in "civictheme_page" "node" with "title" of "[TEST] Page with container" has "civictheme_manual_list" paragraph:
+      | field_c_p_title             | [TEST] Reference list title |
+      | field_c_p_list_column_count | 3                           |
+      | field_c_p_list_fill_width   | 0                           |
+    And "field_c_p_list_items" in "civictheme_manual_list" "paragraph" with "field_c_p_title" of "[TEST] Reference list title" has "civictheme_snippet_ref" paragraph:
+      | field_c_p_reference | [TEST] Referenced Page 1 |
+      | field_c_p_theme     | light                    |
+    And "field_c_p_list_items" in "civictheme_manual_list" "paragraph" with "field_c_p_title" of "[TEST] Reference list title" has "civictheme_snippet_ref" paragraph:
+      | field_c_p_reference | [TEST] Referenced Page 2 |
+      | field_c_p_theme     | dark                     |
+
+    When I visit "civictheme_page" "[TEST] Page with container"
+    And I should see the text "[TEST] Reference list title"
+    And I should see 1 ".ct-list" elements
+    And I should see 2 ".ct-snippet" elements
+    And I should see 1 ".ct-snippet.ct-theme-light" elements
+    And I should see 1 ".ct-snippet.ct-theme-dark" elements
+    And I should see 2 ".ct-snippet__title" elements
+    And I should see 2 ".ct-snippet__summary" elements
+    And I should see 2 ".ct-snippet__title__link" elements
+    And I should see 2 ".ct-snippet__tags" elements
+    And I should see the text "[TEST] Referenced Page 1"
+    And I should see the text "Summary 1"
+    And I should see the text "[TEST] Topic 1"
+    And I should see the text "[TEST] Referenced Page 2"
+    And I should see the text "Summary 2"
+    And I should see the text "[TEST] Topic 2"
+    And I should see the text "[TEST] Topic 3"