diff --git a/sanityv3/schemas/documents/magazine.ts b/sanityv3/schemas/documents/magazine.ts
index 9f8b825fc..4f8a5251a 100644
--- a/sanityv3/schemas/documents/magazine.ts
+++ b/sanityv3/schemas/documents/magazine.ts
@@ -157,6 +157,7 @@ export default {
         { type: 'pullQuote', initialValue: { background: defaultColors[0] } },
         { type: 'accordion' },
         { type: 'promoTileArray' },
+        { type: 'promoTextTileArray' },
         { type: 'promotion' },
         { type: 'iframe' },
         { type: 'imageCarousel' },
diff --git a/sanityv3/schemas/documents/page.ts b/sanityv3/schemas/documents/page.ts
index 799f4df1c..2788c6100 100644
--- a/sanityv3/schemas/documents/page.ts
+++ b/sanityv3/schemas/documents/page.ts
@@ -59,6 +59,7 @@ export default {
         { type: 'pullQuote', initialValue: { background: defaultColors[0] } },
         { type: 'accordion' },
         { type: 'promoTileArray' },
+        { type: 'promoTextTileArray' },
         { type: 'promotion' },
         { type: 'table' },
         { type: 'stockValuesApi' },
diff --git a/sanityv3/schemas/index.js b/sanityv3/schemas/index.js
index dfb745a4c..150791e4a 100644
--- a/sanityv3/schemas/index.js
+++ b/sanityv3/schemas/index.js
@@ -56,7 +56,9 @@ import menuLink from './objects/menuLink'
 import newsList from './objects/newsList'
 import positionedInlineImage from './objects/positionedInlineImage'
 import promoTile from './objects/promoTile'
+import promoTextTile from './objects/promoTextTile'
 import promoTileArray from './objects/promoTileArray'
+import promoTextTileArray from './objects/promoTextTileArray'
 import promoteEvents from './objects/promotion/promoteEvents'
 import promoteMagazine from './objects/promotion/promoteMagazine'
 import promoteNews from './objects/promotion/promoteNews'
@@ -131,7 +133,9 @@ const RemainingSchemas = [
   textWithIconArray,
   linkSelector,
   promoTile,
+  promoTextTile,
   promoTileArray,
+  promoTextTileArray,
   stockValuesApi,
   iframe,
   basicIframe,
diff --git a/sanityv3/schemas/objects/promoTextTile.tsx b/sanityv3/schemas/objects/promoTextTile.tsx
new file mode 100644
index 000000000..96e38b368
--- /dev/null
+++ b/sanityv3/schemas/objects/promoTextTile.tsx
@@ -0,0 +1,101 @@
+import { label } from '@equinor/eds-icons'
+import type { PortableTextBlock } from 'sanity'
+import type { ColorSelectorValue } from '../components/ColorSelector'
+import { EdsIcon } from '../../icons'
+import type { LinkSelector } from './linkSelector'
+import { configureBlockContent } from '../editors'
+import { getLinkSelectorFields } from './linkSelector'
+import blocksToText from '../../helpers/blocksToText'
+
+const ingressBlockContentType = configureBlockContent({
+  h1: false,
+  h2: false,
+  h3: false,
+  h4: false,
+  internalLink: false,
+  externalLink: false,
+  attachment: false,
+  lists: false,
+})
+
+export type PromoTextTile = {
+  _type: 'promoTextTile'
+  linkLabelAsTitle?: boolean
+  link?: LinkSelector
+  isLink?: boolean
+  background?: ColorSelectorValue
+}
+
+const linkFields = getLinkSelectorFields('label', 'isLink')
+
+export default {
+  title: 'Promo text tile',
+  name: 'promoTextTile',
+  type: 'object',
+  fieldsets: [
+    {
+      title: 'Design options',
+      name: 'design',
+      description: 'Some options for design',
+      options: {
+        collapsible: true,
+        collapsed: false,
+      },
+    },
+    {
+      name: 'link',
+      title: 'Link',
+      description: 'Select either an internal link or external URL.',
+    },
+    {
+      name: 'label',
+      title: 'Label',
+      description: 'The label that the link/button should have.',
+    },
+  ],
+  fields: [
+    {
+      name: 'ingress',
+      title: 'Promo Text',
+      type: 'array',
+      of: [ingressBlockContentType],
+    },
+    {
+      name: 'isLink',
+      type: 'boolean',
+      title: 'Use a link',
+      description: 'Link to another piece of content',
+      initialValue: false,
+    },
+    ...linkFields,
+    {
+      name: 'showLinkLabel',
+      title: 'Show link label',
+      description: 'This will add the text to the button',
+      type: 'boolean',
+      initialValue: false,
+      hidden: ({ parent }: { parent: PromoTextTile }) => !parent.isLink,
+      fieldset: 'label',
+    },
+    {
+      title: 'Background',
+      description: 'Pick a colour for the background. Default is white.',
+      name: 'background',
+      type: 'colorlist',
+      fieldset: 'design',
+    },
+  ],
+  preview: {
+    select: {
+      link: 'label',
+      ingress: 'ingress',
+    },
+    prepare({ link, ingress }: { link: string; ingress: PortableTextBlock[] }) {
+      return {
+        title: link || blocksToText(ingress) || 'Promo Text Tile',
+        subtitle: `Promo text tile component`,
+        media: EdsIcon(label),
+      }
+    },
+  },
+}
diff --git a/sanityv3/schemas/objects/promoTextTileArray.tsx b/sanityv3/schemas/objects/promoTextTileArray.tsx
new file mode 100644
index 000000000..f23ab0871
--- /dev/null
+++ b/sanityv3/schemas/objects/promoTextTileArray.tsx
@@ -0,0 +1,43 @@
+import { collection_2 } from '@equinor/eds-icons'
+import { EdsIcon } from '../../icons'
+import type { Rule } from 'sanity'
+import type { PromoTextTile } from './promoTextTile'
+
+export type PromoTextTileArray = {
+  _type: 'promoTextTileArray'
+  group: PromoTextTile[]
+}
+
+export default {
+  type: 'object',
+  name: 'promoTextTileArray',
+  title: 'Promo text tiles',
+  fields: [
+    {
+      name: 'spacing',
+      type: 'boolean',
+      title: 'Space between other components',
+      initialValue: false,
+    },
+    {
+      type: 'array',
+      name: 'group',
+      description: 'Add promo tiles as one or a pair',
+      title: 'Promo text tiles',
+      of: [{ type: 'promoTextTile' }],
+      validation: (Rule: Rule) => Rule.required().min(1).max(2),
+    },
+  ],
+  preview: {
+    select: {
+      group: 'group',
+    },
+    prepare() {
+      return {
+        title: 'Promo text tiles',
+        subtitle: `Promo text tile component`,
+        media: EdsIcon(collection_2),
+      }
+    },
+  },
+}
diff --git a/sanityv3/schemas/objects/promoTile.tsx b/sanityv3/schemas/objects/promoTile.tsx
index 531a5f115..927d8bec8 100644
--- a/sanityv3/schemas/objects/promoTile.tsx
+++ b/sanityv3/schemas/objects/promoTile.tsx
@@ -6,14 +6,13 @@ import { EdsIcon } from '../../icons'
 import CompactBlockEditor from '../components/CompactBlockEditor'
 import type { ImageWithAlt } from './imageWithAlt'
 import type { LinkSelector } from './linkSelector'
-/* eslint-disable @typescript-eslint/ban-ts-comment */
 import { configureTitleBlockContent } from '../editors'
 
 const titleContentType = configureTitleBlockContent()
 
 export type PromoTile = {
   _type: 'promoTile'
-  title: any[]
+  title: PortableTextBlock[]
   linkLabelAsTitle?: boolean
   image?: ImageWithAlt
   link?: LinkSelector
@@ -50,7 +49,9 @@ export default {
     {
       name: 'title',
       type: 'array',
-      inputComponent: CompactBlockEditor,
+      components: {
+        input: CompactBlockEditor,
+      },
       of: [titleContentType],
       title: 'Title',
       hidden: ({ parent }: { parent: PromoTile }) => parent?.linkLabelAsTitle,
@@ -92,13 +93,13 @@ export default {
       linkLabelAsTitle,
       link,
     }: {
-      title: any[]
+      title: PortableTextBlock[]
       imageUrl: string
       linkLabelAsTitle: boolean
       link: string
     }) {
       return {
-        title: linkLabelAsTitle ? link : blocksToText(title as any[]),
+        title: linkLabelAsTitle ? link : blocksToText(title),
         subtitle: `Promo tile component`,
         media: imageUrl ? <img src={imageUrl} alt="" style={{ height: '100%' }} /> : EdsIcon(label),
       }
diff --git a/web/components/src/Text/Text.tsx b/web/components/src/Text/Text.tsx
index ec17c2c3b..98a1b8fef 100644
--- a/web/components/src/Text/Text.tsx
+++ b/web/components/src/Text/Text.tsx
@@ -41,7 +41,7 @@ const StyledText = styled(Typography)<StyledTextProps>`
 `
 
 export type TextProps = {
-  size?: 'regular' | 'md' | 'small' | 'lg'
+  size?: 'regular' | 'md' | 'small' | 'lg' | 'ml'
   lineHeight?: '1' | '2' | '2_5' | '3'
   bold?: boolean
   italic?: boolean
@@ -53,6 +53,7 @@ export type TextProps = {
 /* Should be easy enough to change later on */
 const sizes = {
   lg: 'var(--typeScale-4_5)',
+  ml: 'var(--typeScale-3)',
   regular: 'var(--typeScale-1)',
   md: 'var(--typeScale-2)',
   small: 'var(--typeScale-0)',
diff --git a/web/lib/queries/common/actions/linkSelectorFields.ts b/web/lib/queries/common/actions/linkSelectorFields.ts
index 14d3c7f1d..8300adbb9 100644
--- a/web/lib/queries/common/actions/linkSelectorFields.ts
+++ b/web/lib/queries/common/actions/linkSelectorFields.ts
@@ -15,22 +15,26 @@ export const linkReferenceFields = /* groq */ `
   }
 `
 
-const linkSelectorFields = /* groq */ `
-_type == "linkSelector" => {
-  "id": _key,
-  "type": select(
-    defined(url) => "externalUrl", "internalUrl"
-  ),
-  label,
-  ariaLabel,
-  "link": select(
-    linkToOtherLanguage == true =>
-      referenceToOtherLanguage->${linkReferenceFields},
-      reference->${linkReferenceFields},
-  ),
-  "href": url,
-  anchorReference,
-}
+export const linkSelectorFields = /* groq */ `
+  {
+    "id": _key,
+    "type": select(
+      defined(url) => "externalUrl", "internalUrl"
+    ),
+    label,
+    ariaLabel,
+    "link": select(
+      linkToOtherLanguage == true =>
+        referenceToOtherLanguage->${linkReferenceFields},
+        reference->${linkReferenceFields},
+    ),
+    "href": url,
+    anchorReference,
+  }
+`
+
+const linkSelector = /* groq */ `
+  _type == "linkSelector" => ${linkSelectorFields}
 `
 
-export default linkSelectorFields
+export default linkSelector
diff --git a/web/lib/queries/common/eventContentFields.ts b/web/lib/queries/common/eventContentFields.ts
index 1a2d9aea2..2bcfd1076 100644
--- a/web/lib/queries/common/eventContentFields.ts
+++ b/web/lib/queries/common/eventContentFields.ts
@@ -1,5 +1,5 @@
 import markDefs from './blockEditorMarks'
-import linkSelectorFields from './actions/linkSelectorFields'
+import linkSelector from './actions/linkSelectorFields'
 import downloadableFileFields from './actions/downloadableFileFields'
 import downloadableImageFields from './actions/downloadableImageFields'
 
@@ -76,7 +76,7 @@ export const eventContentFields = /* groq */ `
     title,
     heroImage,
     "links": links[]{
-      ${linkSelectorFields},
+      ${linkSelector},
       ${downloadableFileFields},
       ${downloadableImageFields},
     },
diff --git a/web/lib/queries/common/heroFields.ts b/web/lib/queries/common/heroFields.ts
index d45e7b81d..3a5618601 100644
--- a/web/lib/queries/common/heroFields.ts
+++ b/web/lib/queries/common/heroFields.ts
@@ -1,4 +1,4 @@
-import linkSelectorFields from './actions/linkSelectorFields'
+import linkSelector from './actions/linkSelectorFields'
 
 export const heroFields = /* groq */ `{
     "type": coalesce(heroType, 'default'),
@@ -16,6 +16,6 @@ export const heroFields = /* groq */ `{
       "ratio": heroLoopingVideoRatio,
     },
     "link": heroLink[0]{
-      ${linkSelectorFields}
+      ${linkSelector}
     }
   }`
diff --git a/web/lib/queries/common/newsSubqueries.ts b/web/lib/queries/common/newsSubqueries.ts
index bf029a457..261f0133e 100644
--- a/web/lib/queries/common/newsSubqueries.ts
+++ b/web/lib/queries/common/newsSubqueries.ts
@@ -1,6 +1,6 @@
 import downloadableFileFields from './actions/downloadableFileFields'
 import downloadableImageFields from './actions/downloadableImageFields'
-import linkSelectorFields from './actions/linkSelectorFields'
+import linkSelector from './actions/linkSelectorFields'
 import markDefs from './blockEditorMarks'
 
 export const iframeForNewsQuery = /* groq */ `iframe {
@@ -43,7 +43,7 @@ export const relatedLinksForNewsQuery = /* groq */ `relatedLinks {
     title,
     heroImage,
     "links": links[]{
-      ${linkSelectorFields},
+      ${linkSelector},
       ${downloadableFileFields},
       ${downloadableImageFields},
     }
diff --git a/web/lib/queries/common/pageContentFields.ts b/web/lib/queries/common/pageContentFields.ts
index 43cf55fdd..789483c21 100644
--- a/web/lib/queries/common/pageContentFields.ts
+++ b/web/lib/queries/common/pageContentFields.ts
@@ -1,9 +1,10 @@
 import { iframeCarouselFields } from '../iframeCarouselFields'
 import { videoPlayerCarouselFields } from '../videoPlayerCarouselFields'
 import { videoPlayerFields } from '../videoPlayerFields'
+import { promoTextTileArrayFields } from '../promoTextTileArrayFields'
 import downloadableFileFields from './actions/downloadableFileFields'
 import downloadableImageFields from './actions/downloadableImageFields'
-import linkSelectorFields, { linkReferenceFields } from './actions/linkSelectorFields'
+import linkSelector, { linkReferenceFields } from './actions/linkSelectorFields'
 import markDefs from './blockEditorMarks'
 import { eventPromotionFields, futureEventsQuery, pastEventsQuery } from './eventPromotion'
 import { imageCarouselFields } from './imageCarouselFields'
@@ -33,7 +34,7 @@ const pageContentFields = /* groq */ `
       "extension": asset-> extension
     },
     "action": action[0]{
-      ${linkSelectorFields},
+      ${linkSelector},
       ${downloadableFileFields},
       ${downloadableImageFields},
     },
@@ -52,7 +53,7 @@ const pageContentFields = /* groq */ `
     ingress[]{..., ${markDefs}},
     text[]{..., ${markDefs}},
     "callToActions": action[]{
-      ${linkSelectorFields},
+      ${linkSelector},
       ${downloadableFileFields},
       ${downloadableImageFields},
     },
@@ -194,7 +195,7 @@ const pageContentFields = /* groq */ `
     },
     frameTitle,
     "action": action[0]{
-      ${linkSelectorFields},
+      ${linkSelector},
     },
     url,
     "cookiePolicy": coalesce(cookiePolicy, 'none'),
@@ -515,6 +516,9 @@ const pageContentFields = /* groq */ `
   _type == "videoPlayerCarousel" => {
     ${videoPlayerCarouselFields}
   },
+  _type == "promoTextTileArray" => {
+    ${promoTextTileArrayFields}
+  },
 `
 
 export default pageContentFields
diff --git a/web/lib/queries/iframeCarouselFields.ts b/web/lib/queries/iframeCarouselFields.ts
index 7a55acf15..2c606aacf 100644
--- a/web/lib/queries/iframeCarouselFields.ts
+++ b/web/lib/queries/iframeCarouselFields.ts
@@ -1,11 +1,11 @@
-import linkSelectorFields from './common/actions/linkSelectorFields'
+import linkSelector from './common/actions/linkSelectorFields'
 
 export const iframeCarouselFields = /* groq */ `
     "id": _key,
     "type": _type,
     title,
     items[]{..., "action": action[0]{
-      ${linkSelectorFields},
+      ${linkSelector},
     },},
     "designOptions": {
       "background": coalesce(background.title, 'none'),
diff --git a/web/lib/queries/magazine.ts b/web/lib/queries/magazine.ts
index d4e12998c..6ce8fd0fc 100644
--- a/web/lib/queries/magazine.ts
+++ b/web/lib/queries/magazine.ts
@@ -1,7 +1,7 @@
 import { heroFields } from './common/heroFields'
 import pageContentFields from './common/pageContentFields'
 import slugsForNewsAndMagazine from './slugsForNewsAndMagazine'
-import linkSelectorFields from './common/actions/linkSelectorFields'
+import linkSelector from './common/actions/linkSelectorFields'
 import downloadableFileFields from './common/actions/downloadableFileFields'
 import downloadableImageFields from './common/actions/downloadableImageFields'
 import markDefs from './common/blockEditorMarks'
@@ -23,7 +23,7 @@ const footerComponentFields = /* groq */ `
     "extension": asset-> extension
   },
   "action": action[0]{
-    ${linkSelectorFields},
+    ${linkSelector},
     ${downloadableFileFields},
     ${downloadableImageFields},
   },
diff --git a/web/lib/queries/promoTextTileArrayFields.ts b/web/lib/queries/promoTextTileArrayFields.ts
new file mode 100644
index 000000000..dc4b315ef
--- /dev/null
+++ b/web/lib/queries/promoTextTileArrayFields.ts
@@ -0,0 +1,17 @@
+import { linkSelectorFields } from './common/actions/linkSelectorFields'
+import markDefs from './common/blockEditorMarks'
+
+export const promoTextTileArrayFields = /* groq */ `
+    "id": _key,
+    "type": _type,
+    spacing,
+    "group": group[]{
+        "id": _key,
+        ingress[]{..., ${markDefs}},
+        showLinkLabel,
+        "action": ${linkSelectorFields},
+        "designOptions": {
+            "background": coalesce(background.title, 'none'),
+        },
+    },
+`
diff --git a/web/lib/queries/videoPlayerFields.ts b/web/lib/queries/videoPlayerFields.ts
index bd09c9a95..14412d284 100644
--- a/web/lib/queries/videoPlayerFields.ts
+++ b/web/lib/queries/videoPlayerFields.ts
@@ -1,4 +1,4 @@
-import linkSelectorFields from './common/actions/linkSelectorFields'
+import linkSelector from './common/actions/linkSelectorFields'
 import markDefs from './common/blockEditorMarks'
 
 export const videoPlayerFields = /* groq */ `
@@ -10,7 +10,7 @@ export const videoPlayerFields = /* groq */ `
     ${markDefs},
   },
   "action": action[0] {
-    ${linkSelectorFields},
+    ${linkSelector},
   },
   "video": {
     "title": videoFile->video.title,
diff --git a/web/pageComponents/pageTemplates/shared/SharedPageContent.tsx b/web/pageComponents/pageTemplates/shared/SharedPageContent.tsx
index 30d90d0f7..f42f073ec 100644
--- a/web/pageComponents/pageTemplates/shared/SharedPageContent.tsx
+++ b/web/pageComponents/pageTemplates/shared/SharedPageContent.tsx
@@ -7,6 +7,7 @@ import TextWithIconArray from '../../topicPages/TextWithIconArray'
 import PageQuote from '../../topicPages/PageQuote'
 import AccordionBlock from '../../topicPages/Accordion/AccordionBlock'
 import PromoTileArray from '../../topicPages/PromoTileArray'
+import PromoTextTileArray from '../../topicPages/PromoTextTileArray'
 import IFrame from '../../topicPages/IFrame'
 import Promotion from '../../topicPages/Promotion'
 import Form from '../../topicPages/Form/Form'
@@ -33,6 +34,7 @@ import {
   QuoteData,
   AccordionData,
   PromoTileArrayData,
+  PromoTextTileArrayData,
   IFrameData,
   PromotionData,
   FormData,
@@ -58,6 +60,7 @@ type ComponentProps =
   | QuoteData
   | AccordionData
   | PromoTileArrayData
+  | PromoTextTileArrayData
   | IFrameData
   | PromotionData
   | FormData
@@ -97,6 +100,8 @@ export const PageContent = ({ data }: PageContentProps) => {
         return <AccordionBlock key={c.id} data={c as AccordionData} anchor={anchorReference} />
       case 'promoTileArray':
         return <PromoTileArray key={c.id} data={c as PromoTileArrayData} anchor={anchorReference} />
+      case 'promoTextTileArray':
+        return <PromoTextTileArray key={c.id} data={c as PromoTextTileArrayData} anchor={anchorReference} />
       case 'iframe':
         return <IFrame key={c.id} data={c as IFrameData} anchor={anchorReference} />
       case 'promotion':
diff --git a/web/pageComponents/shared/portableText/PromoTextTileIngress.tsx b/web/pageComponents/shared/portableText/PromoTextTileIngress.tsx
new file mode 100644
index 000000000..5ca4fbdf0
--- /dev/null
+++ b/web/pageComponents/shared/portableText/PromoTextTileIngress.tsx
@@ -0,0 +1,39 @@
+import { PortableText, PortableTextProps, PortableTextReactComponents } from '@portabletext/react'
+import isEmpty from './helpers/isEmpty'
+import { Sub, Sup, Strikethrough } from './components'
+
+import type { PortableTextBlock } from '@portabletext/types'
+
+import { Text } from '@components'
+
+const defaultComponents = (centered: boolean) => {
+  return {
+    block: {
+      normal: ({ children }: PortableTextBlock) => {
+        if (isEmpty(children)) return null
+        return (
+          <Text size="ml" centered={centered} style={{ margin: 0 }}>
+            <>{children}</>
+          </Text>
+        )
+      },
+    },
+    marks: { sub: Sub, sup: Sup, s: Strikethrough },
+  }
+}
+
+type IngressTextProps = {
+  centered?: boolean
+} & PortableTextProps
+
+const PromotileTitleText = ({ value, components = {}, centered = false, ...props }: IngressTextProps) => {
+  return (
+    <PortableText
+      value={value}
+      components={{ ...defaultComponents(centered), ...components } as PortableTextReactComponents}
+      {...props}
+    />
+  )
+}
+
+export default PromotileTitleText
diff --git a/web/pageComponents/topicPages/PromoTextTileArray.tsx b/web/pageComponents/topicPages/PromoTextTileArray.tsx
new file mode 100644
index 000000000..7d8c11d47
--- /dev/null
+++ b/web/pageComponents/topicPages/PromoTextTileArray.tsx
@@ -0,0 +1,105 @@
+import { BackgroundContainer, Card } from '@components'
+import { tokens } from '@equinor/eds-tokens'
+import { CSSProperties } from 'react'
+import styled from 'styled-components'
+import type { PromoTextTileArrayData, PromoTextTileData } from '../../types/types'
+import { PromoTileButton } from './PromoTileButton'
+import { PortableTextBlock } from '@portabletext/types'
+import PromoTextTileIngress from '../shared/portableText/PromoTextTileIngress'
+import useWindowSize from '../../lib/hooks/useWindowSize'
+
+const { Action, Text } = Card
+
+const Container = styled.div<{ isMultipleCards: boolean; isSpacing?: boolean }>`
+  display: grid;
+  grid-gap: var(--space-medium);
+  padding: var(--space-large) var(--layout-paddingHorizontal-large);
+  max-width: var(--maxViewportWidth);
+  margin: auto;
+  grid-template-columns: ${({ isMultipleCards }) =>
+    isMultipleCards ? 'repeat(auto-fit, minmax(min(100%, 280px), 1fr));' : '1fr'};
+  ${({ isSpacing }) =>
+    isSpacing && {
+      marginTop: '50px',
+      marginBottom: '50px',
+    }}
+`
+
+const StyledBackgroundContainer = styled(BackgroundContainer)`
+  border-radius: ${tokens.shape.corners.borderRadius};
+  box-shadow: var(--card-box-shadow);
+`
+
+const StyledCard = styled(Card)<{ alignLeft: boolean }>`
+  justify-content: ${({ alignLeft }) => (alignLeft ? 'flex-start' : 'center')};
+  width: 100%;
+  --card-maxWidth: 280px;
+  height: 300px;
+  overflow: hidden;
+`
+
+const ContentWrapper = styled.div<{ alignLeft: boolean; hasLink: boolean }>`
+  display: ${({ hasLink, alignLeft }) => (hasLink ? (alignLeft ? 'flex' : 'inline-grid') : 'inline-grid')};
+  align-items: ${({ hasLink, alignLeft }) => (hasLink ? (alignLeft ? 'flex-start' : 'center') : 'center')};
+  flex-direction: column;
+  height: 100%;
+  justify-items: center;
+
+  @media (max-width: 1004px) {
+    align-items: center;
+    display: inline-grid;
+  }
+`
+
+const PromoTextTileArray = ({ data, anchor }: { data: PromoTextTileArrayData; anchor?: string }) => {
+  const { width } = useWindowSize()
+  if (!data.group) return null
+  const isMultipleCards = data.group.length > 1
+
+  return (
+    <div className="background-none" id={anchor}>
+      <Container isMultipleCards={isMultipleCards} isSpacing={data?.spacing}>
+        {data.group.map((tile: PromoTextTileData) => {
+          const { id, designOptions, action, showLinkLabel, ingress } = tile
+          const { background } = designOptions
+
+          return (
+            <StyledBackgroundContainer disableContainerWrapper={true} background={background} key={id}>
+              <StyledCard
+                type="promo"
+                textOnly={true}
+                alignLeft={isMultipleCards}
+                style={
+                  {
+                    padding: 'var(--space-large) 0 var(--space-xLarge) 0',
+                    fontSize: 'var(--typeScale-5)',
+                  } as CSSProperties
+                }
+              >
+                <ContentWrapper alignLeft={isMultipleCards} hasLink={!!tile.action}>
+                  <Text>
+                    <PromoTextTileIngress
+                      centered={!isMultipleCards || Boolean(width && width < 1004)}
+                      value={ingress as PortableTextBlock[]}
+                    />
+                  </Text>
+                  {action.label && (
+                    <Action>
+                      {showLinkLabel ? (
+                        <PromoTileButton action={action} template="unstyledText" hasImage={true} />
+                      ) : (
+                        <PromoTileButton action={action} template="icon" hasImage={true} />
+                      )}
+                    </Action>
+                  )}
+                </ContentWrapper>
+              </StyledCard>
+            </StyledBackgroundContainer>
+          )
+        })}
+      </Container>
+    </div>
+  )
+}
+
+export default PromoTextTileArray
diff --git a/web/pageComponents/topicPages/PromoTileArray.tsx b/web/pageComponents/topicPages/PromoTileArray.tsx
index 0df5dff34..b205f0f24 100644
--- a/web/pageComponents/topicPages/PromoTileArray.tsx
+++ b/web/pageComponents/topicPages/PromoTileArray.tsx
@@ -97,7 +97,7 @@ const PromoTileArray = ({ data, anchor }: { data: PromoTileArrayData; anchor?: s
 
           const Content = () =>
             linkLabelAsTitle ? (
-              <PromoTileButton action={action} template="icon" hasImage={hasImage} />
+              <PromoTileButton action={action} template="text" hasImage={hasImage} />
             ) : (
               <>
                 {<>{richTitle(title, hasImage)}</>}
diff --git a/web/pageComponents/topicPages/PromoTileButton.tsx b/web/pageComponents/topicPages/PromoTileButton.tsx
index 999401385..ae2df7299 100644
--- a/web/pageComponents/topicPages/PromoTileButton.tsx
+++ b/web/pageComponents/topicPages/PromoTileButton.tsx
@@ -9,7 +9,7 @@ import styled from 'styled-components'
 type Props = {
   action: LinkData
   hasImage: boolean
-  template?: 'default' | 'icon'
+  template?: 'default' | 'icon' | 'unstyledText' | 'text'
 }
 
 const StyledLink = styled(Link)`
@@ -21,36 +21,52 @@ const Wrapper = styled.div`
   padding: 0 var(--space-medium);
 `
 
-const IconButtonLink = ({ action, hasImage }: { action: LinkData; hasImage: boolean }) => {
+const generateLink = (action: LinkData, hasImage?: boolean, wrapper?: boolean, template?: string) => {
   const url = getUrlFromAction(action)
+
   if (!url) {
     console.warn(`Missing URL on 'IconButtonLink' link with type: '${action.type}' and label: '${action.label}'`)
     return null
   }
+
   const locale = getLocaleFromName(action.link?.lang)
 
-  return (
-    <Wrapper>
-      <StyledLink underline={false} variant="contentLink" locale={locale} href={url} aria-label={action.ariaLabel}>
-        <Card.Title
-          style={
-            {
-              '--card-title-fontSize': hasImage ? 'var(--typeScale-2)' : 'var(--typeScale-4)',
-              '--card-title-fontWeight': hasImage ? '450' : '400',
-            } as CSSProperties
-          }
-        >
-          {action.label}
-        </Card.Title>
-      </StyledLink>
-    </Wrapper>
+  if (template === 'icon') {
+    return (
+      <StyledLink underline={false} variant="contentLink" locale={locale} href={url} aria-label={action.ariaLabel} />
+    )
+  }
+
+  const linkContent = (
+    <Card.Title
+      style={
+        {
+          '--card-title-fontSize': hasImage ? 'var(--typeScale-2)' : 'var(--typeScale-4)',
+          '--card-title-fontWeight': hasImage ? '450' : '400',
+        } as CSSProperties
+      }
+    >
+      {action.label}
+    </Card.Title>
   )
+
+  const linkElement = (
+    <StyledLink underline={false} variant="contentLink" locale={locale} href={url} aria-label={action.ariaLabel}>
+      {linkContent}
+    </StyledLink>
+  )
+
+  return wrapper ? <Wrapper>{linkElement}</Wrapper> : linkElement
 }
 
 export const PromoTileButton = ({ action, template = 'default', hasImage }: Props) => {
   switch (template) {
+    case 'unstyledText':
+      return generateLink(action, hasImage)
+    case 'text':
+      return generateLink(action, hasImage, true)
     case 'icon':
-      return <IconButtonLink action={action} hasImage={hasImage} />
+      return generateLink(action, hasImage, false, template)
     default:
       return <ButtonLink action={action} />
   }
diff --git a/web/types/types.ts b/web/types/types.ts
index 1ad4bc52b..e3ee4feb6 100644
--- a/web/types/types.ts
+++ b/web/types/types.ts
@@ -403,6 +403,14 @@ export type PromoTileData = {
   linkLabelAsTitle?: boolean
 }
 
+export type PromoTextTileData = {
+  id: string
+  ingress: PortableTextBlock[]
+  action: LinkData
+  designOptions: DesignOptions
+  showLinkLabel?: boolean
+}
+
 export type PromoTileArrayData = {
   type: string
   id: string
@@ -410,6 +418,14 @@ export type PromoTileArrayData = {
   useHorizontalScroll: boolean
 }
 
+export type PromoTextTileArrayData = {
+  type: string
+  id: string
+  group: PromoTextTileData[]
+  useHorizontalScroll: boolean
+  spacing?: boolean
+}
+
 export type MenuLinkData = {
   label: string
   href?: string