Domain

NewsletterSection

Email capture section with heading copy, inline email field, and submit action for newsletter signups.

import { NewsletterSection } from '@lostgradient/cinder/newsletter-section';
marketingnewsletterform
01

Overview

Renders an email signup section with heading copy and an inline newsletter form.

Usage

svelte 
<script lang="ts">
  import NewsletterSection from '@lostgradient/cinder/newsletter-section';
</script>

<NewsletterSection title="Get product updates in your inbox" />
Live preview
02

When to use

Use when
  • Collecting subscriber email addresses in a dedicated marketing section.
  • Adding a lightweight signup form beneath blog or CTA content.
Avoid when
03

Examples

NewsletterSection

NewsletterSection with email capture form, helper text, and submission callback.

04

Props

Props for newsletter-section
Name Type Default Required Bindable Description
as 'section' | 'div' 'section' Wrapper element tag.
title text req Main section headline.
description text Optional supporting copy.
emailLabel text 'Email address' Input label text.
emailPlaceholder text Placeholder shown in email input field.
submitLabel text 'Subscribe' Submit button label.
onSubmit (email: string) => void Callback fired after form submission with current email value.
consentText text Optional helper/caveat text rendered under the form controls.
maxWidth 'prose' | 'narrow' | 'wide' | 'full' 'wide' Max width token forwarded to Container.
children snippet Optional supplemental content below helper text.