Framer component · Real HDR
Real light for your Framer site. On HDR screens, your headlines and logos glow up to 8× brighter than white. Everyone else sees your design exactly as you built it.
Side by side
Same white. One of them is light.
Plain CSS stops at #FFFFFF. HDR Glow paints your text through a tiny gain-map image, so HDR screens push it past that ceiling while every other screen shows the same white.
#FFFFFF
Plain CSS white. The ceiling for normal pages.
Normal white
+2 stops · 4×
The same white through a gain map. Real extra light.
Brightness
Set the peak in stops.
Each stop doubles the light. Screens with less headroom scale the glow down smoothly instead of clipping it.
+1 stop · 2×
Subtle. Nav logos and accents.
+2 stops · 4×
Bright. The default.
+3 stops · 8×
Dazzling. One word, once.
Effects & triggers
Make the light move.
Steady, Pulse or Shimmer. Glow always, on hover, or once a section scrolls into view. Motion pauses for visitors who ask for reduced motion.
Pulse · 2.4 s
Breathes between 30% and full glow. Made for live badges.
Shimmer · 3 s
A band of light crosses the text, then rests.
On hover · 0.5 s fade
Lights up under the pointer. Inside a link or button, the whole button triggers it.
In view · 1.2 s fade
Turns on once, when half of it is on screen.
Logo mode
Your logo, lit from inside.
Drop a PNG or SVG into the panel and choose what glows: whites automatically, plus up to three brand colors. The glow is built in the visitor’s browser, so Framer’s image optimization can’t strip it.
Original SVG
HDR Glow · whites + #2F6BFF · 4×
Paper white · #FFFFFF page
Even against a white page.
The line below is set in #EDEDED, a shade darker than this page. On a normal screen it nearly disappears. On an HDR screen it glows above everything around it.
Setup
Three minutes, no code.
Step 1
Drop it in
Add HDR Glow from the Marketplace and place it on the canvas like any other component.
Step 2
Choose Text or Logo
Type a headline in any font, or add a PNG or SVG and pick the colors that glow.
Step 3
Pick brightness and trigger
Set the peak, add Pulse or Shimmer, and choose Always, On hover or In view. Publish as usual.
Where it glows
Chrome 137+
Glows on HDR screens
Safari 26 · iOS 26
Glows on Mac, iPhone and iPad
Firefox
Shows your normal design
HDR needs a screen with headroom: MacBook Pro, iPhone, recent Android phones and HDR monitors, with battery saver off. In the Framer canvas, SDR preview shows where the glow will land.
One code component. Text and logo modes, three effects, three triggers.
$3 · one-time · single file
Get it on Framer Marketplace