57:I[473921,["/creators-assets/_next/static/immutable/chunks/3c-b-8ufmviux.js","/creators-assets/_next/static/immutable/chunks/2lb80c7sdmm1x.js","/creators-assets/_next/static/immutable/chunks/24qz5wotuh5hj.js","/creators-assets/_next/static/immutable/chunks/24bk4ojcoor5n.js","/creators-assets/_next/static/immutable/chunks/0j6nsovyxcqkz.js","/creators-assets/_next/static/immutable/chunks/3mwqlk6tp5l2t.js","/creators-assets/_next/static/immutable/chunks/2dvu3r_tb3ihz.js","/creators-assets/_next/static/immutable/chunks/1q7v4rdbqi_5d.js","/creators-assets/_next/static/immutable/chunks/2fw--q9y_1nc-.js","/creators-assets/_next/static/immutable/chunks/1w_rozgc2dplq.js","/creators-assets/_next/static/immutable/chunks/0dglr8x18qkm5.js","/creators-assets/_next/static/immutable/chunks/0a8vglvd9phm3.js","/creators-assets/_next/static/immutable/chunks/00hohn9l3ocx9.js","/creators-assets/_next/static/immutable/chunks/06p8bv9p94pxh.js","/creators-assets/_next/static/immutable/chunks/42u1pxaq7eeka.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/2bbm33yuxi64a.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/0kjwwabuczr28.js","/creators-assets/_next/static/immutable/chunks/088oy6f_9ll4s.js","/creators-assets/_next/static/immutable/chunks/22zq93dcklbwz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/3fujn21cf_mt1.js","/creators-assets/_next/static/immutable/chunks/0eljubaqaqluk.js","/creators-assets/_next/static/immutable/chunks/2ch5kewqiwntv.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/3g7os-hf6q3tv.js","/creators-assets/_next/static/immutable/chunks/1e3mmtw6okz19.js","/creators-assets/_next/static/immutable/chunks/3fcb65_46-jt7.js","/creators-assets/_next/static/immutable/chunks/0toe1wcov_38e.js","/creators-assets/_next/static/immutable/chunks/28h79imj-g45k.js","/creators-assets/_next/static/immutable/chunks/2x3imtac9af--.js","/creators-assets/_next/static/immutable/chunks/2t6l_zgbmmx8u.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3nd1mzwm7q_f7.js","/creators-assets/_next/static/immutable/chunks/0_ulklfcrp-s3.js","/creators-assets/_next/static/immutable/chunks/3-uff2nrv83hw.js","/creators-assets/_next/static/immutable/chunks/0alicgkopr9se.js","/creators-assets/_next/static/immutable/chunks/0-kepukl8ldjk.js","/creators-assets/_next/static/immutable/chunks/2-u6q7fsgfx0e.js"],"PostDetailCard"] 58:T8a3,

About this Component

Hologram Button is a premium interactive CTA component for Framer. It combines a glitching character scramble on hover, CRT scanline overlay, and a responsive grid backdrop to create an unmistakably futuristic terminal aesthetic. The optional typewriter click response and corner bracket frame complete the sci-fi experience. Perfect whenever a regular flat button feels too ordinary.

Key Features

Hover glitch effect that randomly scrambles button text characters using a curated symbol set, creating an authentic digital-terminal feel.
CRT scanline overlay with adjustable opacity for a vintage display aesthetic that adds depth and atmosphere.
Responsive grid background that reinforces the holographic projection look without distracting from the label.
Optional typewriter click message that prints a custom response character-by-character, ideal for form submissions or confirmation states.
Spring-physics hover and tap animations for a tactile, responsive feel.
Fully customizable via Framer property controls: hologram color, grid color, scanline opacity, glitch intensity, background color, text color, corner radius, and click message.
Optimized for the Framer editor: heavy motion is disabled on the Canvas so your project stays fast and responsive while designing.
Works with any background and adapts nicely to different sizes and layouts.

Where to Use

Primary CTAs in dark, futuristic landing pages where a standard button would break the immersive aesthetic.
Cyberpunk and sci-fi portfolio sites that need interface elements with genuine character.
Tech product launches and SaaS dashboards aiming for a premium, cutting-edge impression.
Gaming, crypto, and Web3 projects where the UI should feel like a control panel.
Form submission buttons that benefit from a satisfying confirmation typewriter effect.
Any project where you want to add a single high-impact motion element without bloating the rest of the design.

54:[["$","$L57",null,{"post":{"id":"019df238-2213-7520-9bae-c7ec9a9b72d5","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"f976de84-13d0-4d64-8ac9-86fc147d39bb","name":"JIetForce","slug":"-qv7bd","avatar":"https://framerusercontent.com/avatars/users/f976de84-13d0-4d64-8ac9-86fc147d39bb/te_5_b5N9","followed":false,"followsYou":false},"media":[],"resources":[{"id":"ivNrwUnbn9FQfi61Kw4y","resolved":true,"title":"Hologram Button","body":"$58","bodyJson":null,"introduction":"Sci-fi terminal CTA with glitch hover","slug":"hologram-button","author":{"framerUserId":"f976de84-13d0-4d64-8ac9-86fc147d39bb","name":"JIetForce","slug":"-qv7bd","avatar":"https://framerusercontent.com/avatars/users/f976de84-13d0-4d64-8ac9-86fc147d39bb/te_5_b5N9","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/ivNrwUnbn9FQfi61Kw4y/hologram-button-VWFZjqBtGYgXQjQJzKexV8yg8xTetQ","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-01T14:35:41.894Z","updatedAt":"2026-05-05T16:46:43.032Z","publishedAt":"2026-05-04T09:00:58.259Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://determined-artboard-812964.framer.app/","price":"5","paymentUrl":"https://contra.com/products/rn4Ah8ER-hologram-button","workshop":false,"categories":[{"id":"cd81cc33-d6cf-4630-8e59-b5b3100166ba","name":"Buttons","slug":"buttons"}],"lastSaveId":"5SEOIvflWiqodIyo2RlE","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-04T09:00:58.259Z","updatedAt":"2026-05-04T09:00:58.259Z","reported":false,"type":"post"}}],"$L59"]

Suggested for you