diff --git a/ui/src/components/ComponentInfo.css b/ui/src/components/ComponentInfo.css
index 789476b..e382e5f 100644
--- a/ui/src/components/ComponentInfo.css
+++ b/ui/src/components/ComponentInfo.css
@@ -65,7 +65,8 @@
       line-height: 1.875rem;
       font-weight: bold;
       color: #767676; }
-    .ComponentInfo .info p {
+    .ComponentInfo .info p,
+    .ComponentInfo .info .component-description {
       font-size: 0.875rem;
       line-height: 1.875rem; }
   .ComponentInfo .code {
diff --git a/ui/src/components/ComponentInfo.js b/ui/src/components/ComponentInfo.js
index a4cb9a1..a6baacd 100644
--- a/ui/src/components/ComponentInfo.js
+++ b/ui/src/components/ComponentInfo.js
@@ -73,12 +73,17 @@ ComponentInfoInfo.defaultProps = {
   used: []
 };
 
-const ComponentInfoSection = ({ title, children }) => (
-  <section>
-    <h4>{title}</h4>
-    <p>{children}</p>
-  </section>
-);
+class ComponentInfoSection extends Component {
+  render() {
+    return (
+      <section>
+        <h4>{this.props.title}</h4>
+      <div className="component-description" dangerouslySetInnerHTML={ {__html: this.props.children} } />
+      </section>
+    );
+  }
+}
+
 ComponentInfoSection.propTypes = {
   title: PropTypes.string.isRequired,
   children: PropTypes.node.isRequired
diff --git a/ui/src/components/ComponentInfo.scss b/ui/src/components/ComponentInfo.scss
index a555730..954a38a 100644
--- a/ui/src/components/ComponentInfo.scss
+++ b/ui/src/components/ComponentInfo.scss
@@ -37,7 +37,8 @@
       font-weight: bold;
       color: #767676;
     }
-    p {
+    p,
+    .component-description {
       font-size: rem-calc(14);
       line-height: rem-calc(30);
     }