diff --git a/core/modules/block/custom_block/custom_block.module b/core/modules/block/custom_block/custom_block.module
index 83117c8..515186c 100644
--- a/core/modules/block/custom_block/custom_block.module
+++ b/core/modules/block/custom_block/custom_block.module
@@ -138,24 +138,23 @@ function custom_block_theme($existing, $type, $theme, $path) {
   return array(
     'custom_block_block' => array(
       'variables' => array('body' => NULL, 'format' => NULL),
+      'template' => 'custom-block-block',
     ),
     'custom_block_add_list' => array(
       'variables' => array('content' => NULL),
       'file' => 'custom_block.pages.inc',
+      'template' => 'custom-block-add-list',
     ),
   );
 }
 
 /**
- * Returns HTML for a custom block.
+ * Preprocess variables for custom block template.
  *
- * @ingroup themeable
+ * @see custom-block-block.html.twig
  */
-function theme_custom_block_block($variables) {
-  $body = $variables['body'];
-  $format = $variables['format'];
-
-  return check_markup($body, $format);
+function template_preprocess_custom_block_block($variables) {
+  $variables['body'] = check_markup($variables['body'], $variables['format']);
 }
 
 /**
diff --git a/core/modules/block/custom_block/custom_block.pages.inc b/core/modules/block/custom_block/custom_block.pages.inc
index 439030e..9b5d9df 100644
--- a/core/modules/block/custom_block/custom_block.pages.inc
+++ b/core/modules/block/custom_block/custom_block.pages.inc
@@ -50,22 +50,15 @@ function custom_block_add_page() {
  *
  * @ingroup themeable
  */
-function theme_custom_block_add_list($variables) {
-  $content = $variables['content'];
-  $output = '';
-
-  if ($content) {
-    $output = '<dl class="node-type-list">';
-    foreach ($content as $type) {
-      $output .= '<dt>' . l($type->label(), 'block/add/' . $type->id()) . '</dt>';
-      $output .= '<dd>' . filter_xss_admin($type->description) . '</dd>';
-    }
-    $output .= '</dl>';
+function template_preprocess_custom_block_add_list(&$variables) {
+  $variables['types'] = array();
+  foreach ($variables['content'] as $type) {
+    $variables['types'][$type->id] = array();
+    $variables['types'][$type->id]['link'] = l($type->label(), 'block/add/' . $type->id());
+    $variables['types'][$type->id]['description'] = filter_xss_admin($type->description);
   }
-  return $output;
 }
 
-
 /**
  * Page callback: Presents the custom block creation form.
  *
diff --git a/core/modules/block/custom_block/templates/custom-block-add-list.html.twig b/core/modules/block/custom_block/templates/custom-block-add-list.html.twig
new file mode 100644
index 0000000..719928e
--- /dev/null
+++ b/core/modules/block/custom_block/templates/custom-block-add-list.html.twig
@@ -0,0 +1,22 @@
+{#
+/**
+ * Default theme implementation to present the content of a custom block.
+ *
+ * Available variables:
+ * - types: A collection of all the available custom block types.
+ *   - type: The custom block type, containing all the items below.
+ *   - type.link: A link to add a block of this type.
+ *   - type.description: A description of this custom block type.
+ *
+ * @see template_preprocess()
+ * @see template_preprocess_custom_block_add_list()
+ *
+ * @ingroup themeable
+ */
+ #}
+<dl class="node-type-list">
+  {% for type in types %}
+    <dt>{{ type.link }}</dt>
+    <dd>{{ type.description }}</dd>
+  {% endfor %}
+</dl>
\ No newline at end of file
diff --git a/core/modules/block/custom_block/templates/custom-block-block.html.twig b/core/modules/block/custom_block/templates/custom-block-block.html.twig
new file mode 100644
index 0000000..27f06d1
--- /dev/null
+++ b/core/modules/block/custom_block/templates/custom-block-block.html.twig
@@ -0,0 +1,14 @@
+{#
+/**
+ * Default theme implementation to present the content of a custom block.
+ *
+ * Available variables:
+ * - body: The content of the custom block.
+ *
+ * @see template_preprocess()
+ * @see template_preprocess_custom_block_block()
+ *
+ * @ingroup themeable
+ */
+ #}
+ {{ body }}
diff --git a/core/modules/block/lib/Drupal/block/Tests/BlockTest.php b/core/modules/block/lib/Drupal/block/Tests/BlockTest.php
index 27dbfa1..81c7b43 100644
--- a/core/modules/block/lib/Drupal/block/Tests/BlockTest.php
+++ b/core/modules/block/lib/Drupal/block/Tests/BlockTest.php
@@ -110,7 +110,7 @@ public function testCustomBlock() {
 
     // Check that block_block_view() returns the correct content.
     $data = entity_view($block, 'content');
-    $output = render($data);
+    $output = trim(render($data));
 
     $this->drupalSetcontent($output);
     $elements = $this->xpath('//div[@class=:class]', array(':class' => 'field-item even'));
diff --git a/core/themes/seven/template.php b/core/themes/seven/template.php
index 147e557..104cf3d 100644
--- a/core/themes/seven/template.php
+++ b/core/themes/seven/template.php
@@ -63,26 +63,17 @@ function seven_node_add_list($variables) {
 }
 
 /**
- * Overrides theme_custom_block_add_list().
+ * Overrides variables for custom-block-add-list.html.twig
+ *   Add variables for the label and the path separately.
  *
  * Displays the list of available custom block types for creation.
+ *
  */
-function seven_custom_block_add_list($variables) {
-  $content = $variables['content'];
-  $output = '';
-  if ($content) {
-    $output = '<ul class="admin-list">';
-    foreach ($content as $type) {
-      $output .= '<li class="clearfix">';
-      $content = '<span class="label">' . check_plain($type->label()) . '</span>';
-      $content .= '<div class="description">' . filter_xss_admin($type->description) . '</div>';
-      $options['html'] = TRUE;
-      $output .= l($content, 'block/add/' . $type->id(), $options);
-      $output .= '</li>';
-    }
-    $output .= '</ul>';
+function seven_preprocess_custom_block_add_list(&$variables) {
+  foreach ($variables['content'] as $type) {
+    $variables['types'][$type->id]['label'] = check_plain($type->label());
+    $variables['types'][$type->id]['path'] = url('block/add/' . $type->id);
   }
-  return $output;
 }
 
 /**
diff --git a/core/themes/seven/templates/custom-block-add-list.html.twig b/core/themes/seven/templates/custom-block-add-list.html.twig
new file mode 100644
index 0000000..4c2b16b
--- /dev/null
+++ b/core/themes/seven/templates/custom-block-add-list.html.twig
@@ -0,0 +1,23 @@
+{#
+/**
+ * Overrides custom-block-add-list.html.twig
+ *
+ * Available variables:
+ * - types: A collection of all the available custom block types.
+ *   - type: The custom block type, containing all the items below.
+ *   - type.link: A link to add a block of this type.
+ *   - type.description: A description of this custom block type.
+ *   - type.label: The title of the custom block type.
+ *   - type.path: A path for the link to add a block of this type.
+ *
+ * Displays the list of available custom block types for creation.
+ *
+ */
+ #}
+<ul class="admin-list">
+  {% for type in content %}
+    <li class="clearfix">
+      <a href="{{ type.path }}"><span class="label">{{ type.label }}</span><div class="description">{{ type.description }}</div></a>
+    </li>
+  {% endfor %}
+</ul>
\ No newline at end of file
