If you are looking to change the appearance of any website online, you are in the right place. In this article, I’ll cover how you can change the font, font-size, background color, etc of any webpage permanently.
Have you ever wished you could permanently change the appearance of a website?
Maybe you prefer browsing some sites in dark mode, or maybe the font on a site just doesn’t work for you. Well, the good news is that it’s surprisingly easy to make these changes yourself! If there’s a site you visit often but find it cluttered with distractions, you can permanently hide those elements from view.
Imagine being able to scroll YouTube without those annoying Shorts, or checking out your Twitter feed with the sidebars out of the way. With the method I’ll walk you through, the changes you make are localized to each website, meaning they’ll be permanent on that specific site without affecting any others.
Also read: 4 Awesome tricks to Change the Default Fonts in Excalidraw
Change the appearance of a website
This method uses the Arc browser. If you haven’t come across it yet, Arc is an Chromium-based browser (like Google Chrome) but with a bunch of extra features that make browsing a more enjoyable experience. Its available for both Mac and Windows, but I found its more stable and pleasure to use on a Mac.
I have covered a few of its neat features in these blog posts.
- How to open 4 tabs side-by-side on Mac
- Awesome Arc Browser Tips and Tricks
- How to Open Multiple PDFs in the Arc Browser
One standout feature in Arc is called Boosts, which lets you customize the look of any website. It’s easy to use, too! Just go to the website you want to edit, open the Command bar (Cmd + T), and type “new boost” to access the Boost option.
This is how the ‘Boost’ window looks like:
First, you’ll see a lightbulb icon, which is all about adjusting colors on the webpage. Click on it, and start experimenting. Keep in mind, though, that Arc doesn’t let you set the text and background colors separately. The color picker’s designed with some clever math to keep both colors in sync for maximum clarity and readability.
Next, there’s a ‘tweak’ icon that lets you adjust brightness, contrast, and saturation. If you want to go back to the original settings, just click the reset (🚫) button on the right.
Below that, you’ll find a range of font options. Try clicking through these to see how each font changes the look of the page. You’ll also see controls for font size and text case. The font-size icon cycles through 90%, 100% (original), 110%, 125%, and 150%. The case icon, meanwhile, lets you choose from UPPERCASE, lowercase, and Capitalize Each Word.
At the very bottom, you’ll see the zap button, which lets you remove elements from the webpage. This button is the star of the show here and deserves a section of its own—it’s especially handy in specific situations that we’ll dive into soon in the article.
Remove Specific Elements from a Webpage
If there are elements like sidebars, menus, footers, or specific ad spots that feel distracting or make a webpage look cramped, you might want to remove them altogether. With Arc’s zap feature in Boosts, you can clear out these unwanted sections just by clicking on them.
To start zapping, click on the zap button and then tap on any element you want to remove. When you click on an element, three options appear just below it:
- Zap this: Select this to remove just the highlighted element.
- Zap all related elements: Hover over this option and move your cursor left or right to expand your selection. This lets you include more related elements—perfect for situations when you initially selected part of a sidebar but now want to remove the whole thing.
(When you’re done zapping everything you want, just click ‘done’ at the bottom of the page.)
- Cancel: Click this to cancel the zapping action.
Personally, I love using the zap feature to make my Twitter (X) feed cleaner and less cluttered. Here’s a quick look at how Twitter looks before and after zapping away both the sidebars:
Before
After
Remove YouTube shorts from the website
One of my favorite uses for the Zap feature is clearing out YouTube Shorts so I’m not tempted to watch them. Want to do the same? It’s super easy.
Just go to YouTube.com, start a new Boost, click on zap, then click on the Shorts section, and select ‘Zap this’. From now on, no more Shorts in your feed!
Also read: How to Read the New Yorker and Atlantic articles for FREE
You’re not limited to making your own Boosts—you can also access Boosts created by others in the community. To browse these, open the command bar (Cmd + T), type ‘Boost Gallery,’ and hit enter.
This will take you to a page filled with customizations for popular sites like The New York Times, Gmail, Google, Notion, and more. Here’s a preview of what that gallery page looks like:
To use any Boost from the gallery, simply hover over the one you want, and click ‘Get Boost’ when it appears. Just follow the instructions, and you’re good to go!
Conclusion
Customizing the look and feel of websites isn’t just about aesthetics—it’s about making your online experience work for you. With tools like Arc’s Boosts, you can adjust colors, fonts, and even remove distracting elements that clutter up your favorite sites.
Whether you’re hiding YouTube Shorts, decluttering your Twitter feed, or exploring community-created Boosts for even more customization options, these small changes can make a big difference.
Thanks for reading.