Text Carousel — Alchemy Design System

The carousel

A swipe-through Instagram post — a hook to stop the scroll, a run of slides that each land one thought, and a CTA to close. Every slide is a portrait Social Frame, so a screenshot of each is the finished asset. It comes in two styles. Pick one per post.

Quiet and text-led. Centred blocks, one thought per slide. Reach for it when the words carry the post. CarouselSlide.astro

Scroll a row sideways to swipe through its slides.

The two styles

Classic — quiet and text-led on cream / ink. A hook, text slides and a CTA, one thought each.
Surreal — the feed look. Big text straight on a surreal art image, a pill eyebrow, the Alchemy logo and a pointing-hand cue.

Props

Each style has its own props — see the source files above.

Prop	Type	Default	Notes
`Classic — kind`	'hook' \| 'text' \| 'cta'	`'text'`	hook = cover, text = a middle slide, cta = closing card.
`Classic — surface`	'cream' \| 'ink' \| 'paper' \| 'image'	`per kind`	Slide background. Violet is never a full-bleed fill — only an accent.
`Classic — image`	string	`—`	A photo, placed top / bottom / full.
`Surreal — image`	string	`—`	The surreal art background (required).
`Surreal — titleSize / lineHeight`	number	`84 / 1.35`	Per-slide title size and line-height, in px / unitless.
`Surreal — font`	'sans' \| 'serif'	`'sans'`	Whole title face. Serif accents mix into a sans title with <em class="t-serif"> (min. two words).
`Surreal — align / valign`	'left'\|'center' / 'top'\|'center'	`'left' / 'top'`	Horizontal and vertical position of the text.
`Both — eyebrow`	string	`—`	Small sentence-case label (never all-caps).

Rules

Do

Earn the swipe with the hook. If slide one is dull, no one sees slide two.

Keep one style per post. Don’t mix classic and playful slides.

Put your best number on a stat slide, mid-deck.

Don't

Fill a slide with violet. Use it as an accent, or put a photo behind.

Set eyebrows in all-caps.

Cram two ideas onto one slide. Split them.