# Search Reveal: Search Bar Animation

Construction circles expand into a search pill, type your text, then reveal an abstract graphic panel. Use this video template in Subclip or copy its code for Claude.

Canonical URL: https://www.subclip.app/motion-graphics-templates/remotion/search-reveal

Preview video: https://subclipweb.subclip.app/motion-graphics-templates/v1/previews/motion-template-remotion-remocn-search-reveal.mp4?v=38640e261d

Thin construction circles expand and snap into a search bar, your text types in, and a colorful graphic panel opens behind it.

- Framework: Remotion
- Category: UI
- Duration: 4 s
- Aspect ratio: 16:9 landscape
- Code: Get the code (free sign-in): https://www.subclip.app/motion-graphics-templates/remotion/search-reveal

It starts with thin gray construction rings growing on a pale lilac frame, the way a designer lays out a shape. The rings snap into a white rounded search field, the text types itself in a character at a time, and a purple panel with lime shapes opens behind the field. The whole sequence takes under four seconds.

You can set the typed text, the field width, font size and typing speed, show or hide the panel and the guide circles, and change every color: text, field, rings, panel, accent and background. Use it for a product or brand name reveal, a search feature demo or an intro for an AI tool.

## Use it for

- Brand name reveals
- Search feature demos
- AI tool intros
- App launch openers

## What you can change

- `speed`: Playback speed (Number)
- `text`: Typed text (Text)
- `fieldWidth`: Field width (Number)
- `fontSize`: Font size (Number)
- `framesPerCharacter`: Typing speed (frames per character) (Number)
- `showPanel`: Show the graphic panel (On or off)
- `showGuides`: Show the guide circles (On or off)
- `color`: Text color (Color)
- `fieldColor`: Field color (Color)
- `ringColor`: Guide circle color (Color)
- `panelColor`: Panel color (Color)
- `accentColor`: Accent color (Color)
- `backgroundColor`: Background color (Color)
- `reducedMotion`: Reduced motion (On or off)
- `stageBackground`: Background around the scene (Text)

## How to use this template

1. Download Subclip for Mac or Windows. Every template on this page comes pre-installed.
2. Open the Templates panel, pick Search Reveal and drop it on your timeline.
3. Change the text, colors and timing in the layer settings, or ask the AI agent to edit it for you.
4. Export your video, or download the code to use the template in your own project.

Built on Search Reveal from remocn: https://remocn.dev