Motion

Reveal

A short, one-shot entrance around content.

components.Reveal · RevealProps

A gentle arrival.

Reload to replay. Reduced-motion settings are respected.

Use it well.

Use fade, rise or scale. It runs on insertion, not scrolling. Respects reduced motion and MotionOff; the div wrapper must fit its HTML parent.

Explore the full demo →

This is the source compiled for the preview. Select the text to copy it, or download the file. Change the package name and demo routes for your application.

package examples

import "github.com/Tend-Stack/TendUI/v2026/components"

templ ExampleReveal() {
	@components.Reveal(components.RevealProps{Effect: components.EntryRise}) {
		@components.Card(components.CardProps{}) {
			<h3>A gentle arrival.</h3>
			<p>Reload to replay. Reduced-motion settings are respected.</p>
		}
	}
}