# Resolution Independent Design **URL:** \ **Category:** Bug Reports\ **Tags:** css\ **Created:** [September 15, 2025, 7:21pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133 "2025-09-15T19:21:38Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![bwheaton](https://avatars.discourse-cdn.com/v4/letter/b/ba8739/32.png) [@bwheaton](https://forum.pinegrow.com/u/bwheaton)\ **Post date:** [September 15, 2025, 7:21pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/1 "2025-09-15T19:21:39Z")
I have to create some elements to live on a very large screen (8K). I can’t design on that size but I want everything to scale up proportionally - fonts, gaps, everything. I could work at 1920 wide if I could then scale up by exactly 4x So - I presume starting with defining everything as percentage is a good first step? Are there any Pinegrow tools that will help? I’m thinking to use tailwind, and currently expecting to use Alpine for dynamic data. Thanks! ---
**Author:** ![PeteSharp](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/petesharp/32/7134_2.png) [@PeteSharp](https://forum.pinegrow.com/u/PeteSharp)\ **Post date:** [September 15, 2025, 9:32pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/2 "2025-09-15T21:32:14Z")
Whats driving the display? Eg. Sending a 4k signal will be upscaled by the display anyway wont it? I doubt you need to design pixel for pixel here. ---
**Author:** ![bwheaton](https://avatars.discourse-cdn.com/v4/letter/b/ba8739/32.png) [@bwheaton](https://forum.pinegrow.com/u/bwheaton)\ **Post date:** [September 15, 2025, 9:44pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/3 "2025-09-15T21:44:33Z")
Don’t need to design pixels but need to render to 8k, yeah. It’s a high res LED with people viewing from close. (If you want the full context it’s a web resource running on a media server at the full res of the LED wall - 4K isn’t any sort of limitation. Definitely an edge case for HTML but some Media Servers use HTML for dynamic content) ---
**Author:** ![matjaz](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/matjaz/32/5_2.png) [@matjaz](https://forum.pinegrow.com/u/matjaz)\ **Post date:** [September 16, 2025, 12:54pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/5 "2025-09-16T12:54:45Z")
How about designing at 1920 and then use filter:scale(4) on body when displaying on the LED screen? ---
**Author:** ![bwheaton](https://avatars.discourse-cdn.com/v4/letter/b/ba8739/32.png) [@bwheaton](https://forum.pinegrow.com/u/bwheaton)\ **Post date:** [September 16, 2025, 5:09pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/6 "2025-09-16T17:09:32Z")
Hmm. filter:scale(4) doesn’t seem to do anything. I found the tailwind transform scale-[4.0] and it sort of works. Gets weird in that some elements are already proportional. ---
**Author:** ![bwheaton](https://avatars.discourse-cdn.com/v4/letter/b/ba8739/32.png) [@bwheaton](https://forum.pinegrow.com/u/bwheaton)\ **Post date:** [September 16, 2025, 10:07pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/7 "2025-09-16T22:07:20Z")
To circle around… I’m using transform and scale=[x.0] and it’s working apparently. I need to be very careful about scaling everything on the page - using vw, vh sometimes and sometimes the tailwind classes work. Hit and miss but it’s looking right. Using the Google developer tools and devices to check. ---
**Author:** ![bwheaton](https://avatars.discourse-cdn.com/v4/letter/b/ba8739/32.png) [@bwheaton](https://forum.pinegrow.com/u/bwheaton)\ **Post date:** [October 4, 2025, 6:24pm UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/8 "2025-10-04T18:24:00Z")
ollow up for those who come after: I struck out on any method to use scaling (inconsistencies), plus some internet research indicated that scale would actually render small and upscale, which isn’t acceptable in this case. I ended up making every single thing on the page use vw and vh type sizes, and it works. ---
**Author:** ![PeteSharp](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/petesharp/32/7134_2.png) [@PeteSharp](https://forum.pinegrow.com/u/PeteSharp)\ **Post date:** [October 8, 2025, 3:26am UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133/9 "2025-10-08T03:26:04Z")
Yeah, I think scale can be problematic. Great you have a solution.