[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/ui/ - UI/UX Lab

Interface design, user experience & usability testing
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1782654267564.jpg (225.01 KB, 1024x1024, img_1782654227921_w0h8ut4e.jpg)ImgOps Exif Google Yandex

085af No.1792

sometimes a standard
backdrop-filter: blur(10px);
looks jittery on older mobile screens. try adding a subtle
rgba(255, 255, 255, 0.1)
background color to the same element to help the eye define the edge. it makes the interface feel much more solid and less like a mistake.
>the secret is the opacity layer

085af No.1793

File: 1782655650699.jpg (325.29 KB, 1024x1024, img_1782655610246_dp15rc92.jpg)ImgOps Exif Google Yandex

>>1792
ive found that adding a 1px solid rgba(255, 255, 255, 0.2) border does even more for the perceived sharpness on low-dpi panels. w/o that hairline stroke, the transition btwn the blur and the background still feels too soft. it basically acts as a fake edge when the hardware cant render the subpixel anti-aliasing properly.


[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">