question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Background blur w/Terminal in Firefox

See original GitHub issue

Hello, I noticed this line https://github.com/DustinBrett/daedalOS/blob/243f57bfaa31b37a05ac75b455277a2887f87d04/components/apps/Terminal/StyledTerminal.ts#L10 when trying to style the terminal. However, it doesn’t seem to be working as backdrop-filter is considered an invalid property name in developer tools.

I looked up xterm’s documentations and couldn’t seem to find anything related.

Is there a proper way to create a blurred terminal background? Or is it not currently supported?

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:14 (11 by maintainers)

github_iconTop GitHub Comments

1reaction
DustinBrettcommented, May 19, 2022

I will close it cause FF blur support is something I have spent way too much time on already. If someone else ever figures it out, would be cool. I see a lot of people on CodePen trying but I’ve never had it look exactly the same with no blur bleed or edge issues using the SVG filter tricks.

Thanks for reporting this, I don’t know why my Chrome worked and Edge didn’t, but I also don’t know enough about will-change and shouldn’t have messed with it yet maybe.

1reaction
Cveinntcommented, May 19, 2022

Thank you for investigating - removing will-change did the trick for me as well! Should I close this issue or leave it open in case Firefox supports backdrop-filter in the future?

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to enable backdrop-filter in Firefox - DEV Community ‍ ‍
The CSS property backdrop-filter allows you apply graphical effects like blur and color filters to the background of your element.
Read more >
Blur effect filter for Firefox - Stack Overflow
I am trying to find a Firefox substitute for: filter: blur(3px); , which will only be supported on Firefox 34. Research has pointed...
Read more >
Blur Any Window in KDE Plasma - sainnhe's blog
The newest KDE plasma natively support blur, but it has many limitations, for example I can't blur vim status line and firefox.
Read more >
How to Apply Blur to xfce 4 Desktop Manager - YouTube
How to apply blur effect to xfce 4 desktop window manager like you would see on KDE, also called kawase blur. We are...
Read more >
Glassmorphism for Firefox - Medium
To create a frosted glass look (known as glassmorphism) on the web, using backdrop-filter: blur() in CSS is the simplest approach if you...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found