Firefox 67: Dark Mode CSS, WebRender, and more

Firefox 67 is available today, bringing a faster and betterJavaScript debugger, support for CSS prefers-color-scheme media queries, and the initial debut ofWebRender in stable Firefox.

These are just the highlights. For complete information, see:

• Firefox 67 Release Notes
• Firefox 67 for Developers
• Firefox 67 Site Compatibility

CSS Color Scheme Queries

New in Firefox 67, the prefers-color-scheme media feature allows sites to adapt their styles to match a user’s preference for dark or light color schemes, a choice that’s begun to appear in operating systems like Windows , macOS and Android . As an example of what this looks like in the real world,Bugzilla uses prefers-color-scheme to trigger a brand new dark theme if the user has set that preference.

The prefers-color-scheme media feature is currently supported in Firefox and Safari, with support in Chrome expected later this year .

Additionally, the revert keyword is now supported, making it possible to revert one or more CSS property values back to their original values specified by the user agent’s default styles (or by a custom user stylesheet if one is set). Defined in Cascading and Inheritance Level 4 , revert is also supported by Safari.

WebRender’s Stable Debut

Nearly four years ago we started work on a new rendering architecture for Firefox with the goal of better utilizing modern graphics hardware. Today, we’re beginning togradually enable WebRender for users on Windows 10 with qualified hardware. This marks the first time that WebRender has been enabled outside of Nightly and Beta builds of Firefox, and we hope to expand the supported platforms in future releases.

You can read more about WebRender in The whole web at maximum FPS: How WebRender gets rid of jank .

More Capable DevTools

Firefox 67 and 68Developer Edition bring enormous improvements to Firefox’s JavaScript Debugger. Discover faster load times, amazing support for source maps, more predictable breakpoints, brand new logpoints, and much more.

We’ve collected the Debugger improvements in their own article: Faster, Smarter JavaScript Debugging in Firefox DevTools .

In addition to the Debugger, the Web Console saw numerous updates, including greater keyboard accessibility and support for importing modules into the current page.

We’ve also removed or deprecated a few seldom-used and experimental tools, including the Canvas Debugger, Shader Editor, Web Audio Inspector, and WebIDE.

Browser Features

Side-by-Side Profiles

Firefox now defaults to using different profiles for each installed version , making it easier than ever to run multiple copies of Firefox side-by-side.

In addition, the browser will warn you if you try to open a newer profile with an older version of Firefox, as such mismatches can occasionally lead to data loss. This protection can be bypassed with the new -allow-downgrade command line argument.

Enhanced Privacy Controls

Firefox 67 better protects your privacy online with new Content Blocking options to avoid known cryptominers and fingerprinters.

You also have more control over your extensions, which can be prevented from running in private browsing windows .

This is the default for all newly installed extensions in Firefox 67, though your previously installed extensions will receive permission by default. You can adjust these permissions on a per-extension basis by visiting about:addons .

Easier Access to Firefox Accounts and Saved Passwords

We’re working hard to make Firefox Accounts more useful and discoverable this year, starting with a newdefault icon in the browser toolbar.

The new icon indicates whether or not you’re signed into a Firefox Account, and makes it easy to perform actions like sending tabs to other devices or manually triggering a sync. Like other toolbar buttons, you can freely move or hide the Firefox Account button according to your preferences.

Check out the many improvements to Firefox’s built-in password manager , including quicker access to your list of saved credentials. You can either click on the new “Logins and Passwords” item in the main menu, or the new “View Saved Logins” button in the login autocomplete popup.

This can be especially useful if you need to look up or edit a login outside of the normal autofill workflow. And, if you use Firefox Sync, you can access your saved passwords with the Firefox Lockbox app for Android or iOS.

Web Platform Features

Support for legacy FIDO U2F APIs

We’ve enabled legacy FIDO U2F support to improve backwards compatibility with sites that have not yet upgraded to its standards-based successor,WebAuthn.

These APIs make it possible for websites to authenticate users with strong, hardware-backed authentication mechanisms like USB security keys orWindows Hello.

AV1 on Windows, Linux, and macOS

Firefox now supports AV1, a next-generation video codec , on all major desktop platforms. Also, playback on those platforms is now powered by dav1d , a faster and more efficient AV1 decoder developed by the VideoLAN and FFmpeg communities.

JavaScript: String.prototype.matchAll() and Dynamic Imports

Firefox joins Chrome in supporting the matchAll() String prototype method, which takes a regular expression and returns an iterator of all matching text, including capturing groups.

The import() function can now be used to dynamically load JavaScript modules, similarly to how the static import statement works. Now it’s possible to load modules conditionally or in response to user actions, though such imports are harder to reason about for build tools that use static analysis for optimizations liketree shaking.