diff --git a/landing/info-block.css b/landing/info-block.css
index 77b476b84..3946173fd 100644
--- a/landing/info-block.css
+++ b/landing/info-block.css
@@ -1,32 +1,38 @@
-@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
-  .info_block {
-    background: rgba(235, 235, 235, 0.05);
-    -webkit-backdrop-filter: blur(12px);
-    backdrop-filter: blur(12px);
-  }
+.textContainer {
+  width: 910px;
+  max-width: 100vw;
+  padding: 120px 32px;
 }
 
-.info_block {
-  --border-radius: 8px;
-  background: rgba(235, 235, 235, 0.05);
-  border-radius: var(--border-radius);
-  /*  36 / 28 = 1.28571429 */
-  /* 36px is the max padding size, 28px is the max font-size */
-  /* Padding scales down with text */
-  padding: 1.28571429rem;
+.header {
+  color: var(--white-80);
+  margin-bottom: 40px;
 }
 
-.title {
-  font-family: 'iA Writer Duo S', monospace;
-  font-style: normal;
-  text-align: left;
-  line-height: 1.35;
-  padding-bottom: clamp(1rem, 0.5817rem + 2.0915vw, 3rem);
-  font-size: clamp(1.875rem, 1.6136rem + 1.3072vw, 3.125rem);
+.header span {
+  background: linear-gradient(90deg, #5d34b3 0%, #a314d5 49.31%);
+  background-clip: text;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
 }
 
-.description {
-  line-height: 1.5;
-  font-weight: 400;
-  font-family: var(--sans-serif);
+.linkContainer {
+  display: flex;
+  align-items: center;
+  width: fit-content;
+}
+
+.link {
+  color: var(--white-100);
+  text-decoration: underline;
+  margin-right: 8px;
+}
+
+.icon {
+  color: var(--white-100);
+}
+
+.linkContainer:hover .link,
+.linkContainer:hover .icon {
+  color: var(--violet-dark-100);
 }
diff --git a/landing/info-block.react.js b/landing/info-block.react.js
index 6ad5a36ee..fe81754e0 100644
--- a/landing/info-block.react.js
+++ b/landing/info-block.react.js
@@ -1,32 +1,68 @@
 // @flow
 
+import { faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import classNames from 'classnames';
 import * as React from 'react';
+import { NavLink } from 'react-router-dom';
 
 import css from './info-block.css';
-import Picture from './Picture.react.js';
+import typography from './typography.css';
 
 type InfoBlockProps = {
-  +title: string,
-  +description: string,
-  +url: string,
-  +alt: string,
-  +imageStyle: string,
-  +infoStyle: string,
+  +containerClassName: string,
+  +colorHeader: boolean,
+  +headerTextContent: string,
+  +infoBlockContent: React.Node,
+  +navLinkDestination: string,
+  +linkTextContent: string,
 };
 function InfoBlock(props: InfoBlockProps): React.Node {
-  const { title, description, url, alt, imageStyle, infoStyle } = props;
+  const {
+    containerClassName,
+    headerTextContent,
+    colorHeader,
+    infoBlockContent,
+    navLinkDestination,
+    linkTextContent,
+  } = props;
+
+  const headerClassName = classNames([typography.heading1, css.header]);
+
+  const linkClassName = classNames([typography.paragraph1, css.link]);
+
+  let headerText;
+  if (colorHeader) {
+    const lastSpaceIndex = headerTextContent.lastIndexOf(' ');
+    const remainingSentence = headerTextContent.substring(0, lastSpaceIndex);
+    const lastWord = headerTextContent.substring(lastSpaceIndex + 1);
+
+    headerText = (
+      <>
+        {remainingSentence}
+        <span> {lastWord}</span>
+      </>
+    );
+  } else {
+    headerText = headerTextContent;
+  }
 
   return (
-    <>
-      <div className={imageStyle}>
-        <Picture alt={alt} url={url} />
-      </div>
-      <div className={`${css.info_block} ${infoStyle}`}>
-        <p className={css.title}>{title}</p>
-        <p className={css.description}>{description}</p>
+    <section className={containerClassName}>
+      <div className={css.textContainer}>
+        <h1 className={headerClassName}>{headerText}</h1>
+        {infoBlockContent}
+        <NavLink to={navLinkDestination} exact className={css.linkContainer}>
+          <p className={linkClassName}>{linkTextContent}</p>
+          <FontAwesomeIcon
+            size="sm"
+            className={css.icon}
+            icon={faExternalLinkAlt}
+          />
+        </NavLink>
       </div>
-    </>
+    </section>
   );
 }
 
 export default InfoBlock;