5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:T6e8,

About this Component

Haytham Reveal is a cinematic hero/preloader entrance built around a dynamic text-to-monogram transformation. Your opening word reveals character by character, collapses into its first letter + custom number, scales into a bold identity mark, then splits open through a horizontal line to reveal your hero image and optional final card.

Perfect For

• Portfolio intros • Creative studio and agency sites • Personal branding • Editorial landing pages

Key Features

• Dynamic name + number text • Responsive text fitting across breakpoints • Adjustable reveal-line height • Custom hero image fit and position • Optional tags and final card • Motion speed, start delay, holds, upscale timing, and split timing controls • Scoped scroll stopper during the intro • Custom typography and colors • Responsive desktop/mobile behavior

How It Works

Drop the component onto your page, upload a hero image, then customize the content, card, tags, appearance, animation timing, and behavior directly from Framer’s property controls. The Canvas displays the finished state while Preview and the published site play the full animation.

Questions?

Reach out at hasanwali6890@gmail.com

Refund Policy

All sales are final upon purchase as this is a non-tangible digital product. Refunds are only available for a confirmed critical technical failure that cannot reasonably be resolved. Refunds are not provided for buyer’s remorse, aesthetic preference, incorrect setup, or post-purchase modifications. Any technical issue must be reported with supporting evidence within 14 days of purchase.

5a:[["$","$L5d",null,{"post":{"id":"01a0dd24-03b7-73df-b08c-eae5a27cfb74","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"10767168-8381-4f2b-9206-2d6c344aae23","name":"Hasan Wali","slug":"hasan-wali","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/98885/avatar-WMhG6M5ak8XBca7qBEj8qK9rJSB8o7.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"cUkASAn7B8D6kcXBkO13","resolved":true,"title":"Haytham Preloader 31","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"About this Component"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Haytham Reveal is a cinematic hero/preloader entrance built around a dynamic text-to-monogram transformation. Your opening word reveals character by character, collapses into its first letter + custom number, scales into a bold identity mark, then splits open through a horizontal line to reveal your hero image and optional final card."}]},{"type":"customHeading","content":[{"type":"text","text":"Perfect For"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"• Portfolio intros • Creative studio and agency sites • Personal branding • Editorial landing pages"}]},{"type":"customHeading","content":[{"type":"text","text":"Key Features"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"• Dynamic name + number text • Responsive text fitting across breakpoints • Adjustable reveal-line height • Custom hero image fit and position • Optional tags and final card • Motion speed, start delay, holds, upscale timing, and split timing controls • Scoped scroll stopper during the intro • Custom typography and colors • Responsive desktop/mobile behavior"}]},{"type":"customHeading","content":[{"type":"text","text":"How It Works"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Drop the component onto your page, upload a hero image, then customize the content, card, tags, appearance, animation timing, and behavior directly from Framer’s property controls. The Canvas displays the finished state while Preview and the published site play the full animation."}]},{"type":"customHeading","content":[{"type":"text","text":"Questions?","marks":[{"type":"bold"}]},{"type":"text","text":" "}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Reach out at "},{"type":"text","text":"hasanwali6890@gmail.com","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"mailto:hasanwali6890@gmail.com","target":"_blank"}}]}]},{"type":"customHeading","content":[{"type":"text","text":"Refund Policy"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"All sales are final upon purchase as this is a non-tangible digital product. Refunds are only available for a confirmed critical technical failure that cannot reasonably be resolved. Refunds are not provided for buyer’s remorse, aesthetic preference, incorrect setup, or post-purchase modifications. Any technical issue must be reported with supporting evidence within 14 days of purchase."}]}]},"introduction":"Cinematic text-to-hero reveal","slug":"haytham-preloader-31","author":{"framerUserId":"10767168-8381-4f2b-9206-2d6c344aae23","name":"Hasan Wali","slug":"hasan-wali","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/98885/avatar-WMhG6M5ak8XBca7qBEj8qK9rJSB8o7.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/10767168-8381-4f2b-9206-2d6c344aae23/01a0dd23-f24e-7290-b9be-42c5e877ce50.png","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-09-26T09:55:19.510Z","updatedAt":"2026-09-26T09:55:19.510Z","publishedAt":"2026-09-26T09:55:19.507Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://popular-package-869331.framer.app","price":"12","paymentUrl":"https://contra.com/payment-link/ho3hprF2-haytham-preloader-31-cinematic-text-to-hero-reveal","workshop":false,"categories":[{"id":"b42eea44-0ea9-4372-9981-70c9e68577c1","name":"Loaders","slug":"loaders"}],"lastSaveId":"JCfOOzpGHx8eyDwM7DDH","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-26T09:55:20.119Z","updatedAt":"2026-09-26T09:55:20.119Z","reported":false}}],"$L5f"]

Suggested for you