device toolbar safari

Stack Exchange Network

Stack Exchange network consists of 183 Q&A communities including Stack Overflow , the largest, most trusted online community for developers to learn, share their knowledge, and build their careers.

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

How can I quickly open a mobile view of a page in a desktop browser?

Since we're now in a mobile-first world, it becomes more and more important to be able to test websites easily on mobile phones, or on emulated mobile phones. I collaborate with people who work on websites and social media offerings, and I would like to encourage them to regularly open websites from their desktop browsers in a mobile view. I'm specifically thinking of the browser's built-in "mobile view" feature, which is often hidden among all the other developer tools a browser provides, but I'm happy to consider anything which is just as quick to set up.

How can you open a mobile view of a website from a desktop browser?

• 23 "Since we're now in a mobile-first world" Woah there a minute... context is for kings. –  Lightness Races in Orbit Feb 6, 2018 at 12:49
• 3 Just a comment - don't know the context really, but if I was asked to be opening webpages from my desktop/laptop in mobile view first ....what's the point of using the desktop? I hope by "encourage", you're not forcing it via some code or other method. Especially since many webpages that do format for mobile are pared down quite a bit and don't have full functionality. –  BruceWayne Feb 6, 2018 at 16:27
• 1 Add a change user agent or similar extension or plug in to your browser, and set a smart phone user agent. –  Salman A Feb 6, 2018 at 17:10
• 1 “I would like to encourage people to regularly open websites from their desktop browsers in a mobile view.” ...That's goofy. And waste all that desktop screen real estate? Desktop and mobile both have their place, and that's why responsive solutions have been developed. Let's deliver the best experience possible for every user, and let people browse on the device that's most comfortable for them. Anyway, valid question, as web designers and developers need to emulate multiple devices when building sites. –  Mentalist Feb 7, 2018 at 2:52
• 2 @Mentalist I meant people who are working on websites and social media offerings. –  Flimm Feb 7, 2018 at 7:28

6 Answers 6

• In Windows/Linux, press Ctrl + Shift + M
• In macOS, press option + command + M

You can also find the menu item under ("Tools"), "Web Developer", "Responsive Design Mode".

Chrome and Edge:

You need to have "Developer Tools" open first:

• In Windows/Linux, press Ctrl + Shift + I or just F12
• In macOS, press option + command + I

Once developer tools is open and focused, you can toggle device emulation:

• In macOS, press command + shift + M

There is a small button in the developer tools toolbar that enables device emulation, if you prefer to click a button rather than press a keyboard shortcut.

It looks like Apple have disabled by default the keyboard shortcut for entering responsive design mode. You can follow this tutorial on configuring a keyboard shortcut for it .

You can find the menu item by clicking "Develop", "Enter Responsive Design Mode". If you can't see the "Develop" menu item, you need to enable it by opening "Preferences", "Advanced", and ticking "Show Develop menu in menu bar".

• 1 Note that ctrl shift M works only if developer tools are already open –  Naramsim Feb 6, 2018 at 10:29
• 3 @Naramsim Thanks. That only applies to Chrome. I've edited my answer. –  Flimm Feb 6, 2018 at 11:19
• 3 For Windows/Chrome, F12 is a potentially easier way to get to Dev Tools... although if the next keystroke is going to be Ctrl-Shift-M, I suppose starting with Ctrl-Shift-I may be more logical. –  sǝɯɐſ Feb 6, 2018 at 13:21
• I believe on previous versions of Safari Cmd+Shift+R would open responsive design mode. Seems to not exist on latest version unless you manually bind it –  Downgoat Feb 6, 2018 at 23:52
• 1 Chrome remembers if you wanted a mobile preview, so once you've enabled it, you can toggle between mobile/desktop simply using F12 –  Pieter De Bie Feb 8, 2018 at 12:26

Flimm’s answer is 100% correct. Just in case remembering the shortcuts is too much of a hassle, it’s this blue button in the Developer Tools to toggle between the web view and mobile/tablet view:

Or with Firefox:

After enabling the device toolbar, you can then choose the make and model of the device you wish to emulate from the dropdown menu.

• 1 What piece of software does the first part refer to? –  Kamil Maciorowski Feb 7, 2018 at 5:22
• @KamilMaciorowski DevTools is the developer tool found in Chrome and Opera. –  OptimusCrime Feb 7, 2018 at 7:46
• @KamilMaciorowski This is not a software, this is available on any of your web browser. Specifically if you're using chrome, right click on any window and click on inspect and you will see this window in your browser docked below or to the right of the browser. These are more commonly known as Dev Tools. –  Shobhit Garg Feb 7, 2018 at 16:13
• @Shobbit Garg Is that the windows, which opens when I press CTRL + Shift + C? –  daniel.heydebreck Feb 8, 2018 at 8:22
• @daniel.neumann Unfortunately I use mac, so I cannot test and see what happens when you press those keys. But referring to the shortcuts listed above, this window should open by pressing "ctrl + shift + I" on chrome, "ctrl + shift + M" on firefox or pressing f12 on IE/Edge. –  Shobhit Garg Feb 8, 2018 at 15:04

For the purpose of testing, i use the following websites :-

• http://www.jamus.co.uk/demos/rwd-demonstrations/
• http://mattkersley.com/responsive/

Both of the above sites allow me to view my web application in multiple device widths.

You can set the user agent and window size from the command line or launch config of a shortcut.

For example:

& "C:\Program Files\Google\Chrome\Application\chrome.exe" --new-window --window-size=375,812 --user-agent="Mozilla/5.0 (Linux; Android 8.0; Pixel 2 Build/OPD3.170816.012) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.67 Mobile Safari/537.36" --user-data-dir=C:\workspace\tmp\chrome https://google.com

The --user-data flag is mandatory to make this work . Create a folder for it.

Add a "user agent switcher" extension in your browser and specify a mobile user agent. If the website is smart enough it will serve you mobile optimized version.

I will not recommend any specific extension. The ideal one should have presets for mobile browsers built-in and the ability to enable or disable user agent switching on per-website basis.

• 1 This is incorrect. Mobile layouts should work based on device / screen dimensions via CSS media queries, not user agent strings - it's not 2006 any more. –  PiX06 Feb 7, 2018 at 13:51
• Most browsers' tool that allows a mobile view also lets you set a user-agent at the same time. –  Flimm Feb 7, 2018 at 14:33
• 1 @PiX06 then no effort is necessary. Just resize the browser window! –  Salman A Feb 7, 2018 at 15:04
• Unfortunately, I find myself with many questions: If I'm resizing the browser window anyway, why do I need to bother with user agents? To which dimensions should I resize the window? How do I measure the window? –  Mathieu K. Feb 9, 2018 at 5:26

The above answers are great for those who like to stick with a single browser, or have limited desktop "workspace" (eg. single monitor less than 21" at a low res).

There is actually an even more interesting solution I've recently discovered: https://blisk.io/

I will refrain from using the (sort of) "affiliate link" for any personal gain (There is a "token based system" that you can earn credits to get things like free "team cloud space" & "premium features" to use with it), but Blisk is actually pretty snazzy.

This Chromium-based "browser built for development" provides a multitude of ways to demo the page in various devices with a vertical "pane" on the LEFT side, much like you see Chrome Developer Tools default to the right vertical column.

It's work a look. Though there are some limits to its "freemium extended functionality", it still works very well to "preview" both the PC and Mobile versions of your pages / sites in a side-by-side comparison. The paid features seem pretty rad too if you work in remote teams (though I personally think it need a better "test drive" program before hooking people on the monthly cost).

Full disclosure: there is an EXTREMELY annoying "time limit" per day on the mobile preview part (toggles open/closed from the icon to the right of the address bar - change the "device preview" from the tiny link-to-the-menu in the top right corner "Show device list").

BliskDemoScreenshot

Also: I've found a few really nifty tricks with Browser Extensions like the 2 different "User-Agent Switcher"'s from Chrome/Firefox that go a bit further by letting you toggle between browser user-agent strings of various Operating Systems AND the browsers for them.

I prefer the "esolutions.se" flavor because of how easy it is to add custom user-agent strings to the list for as many customizations as you could ever want (runs offline also, which can be handy in certain cases): https://chrome.google.com/webstore/detail/user-agent-switcher/clddifkhlkcojbojppdojfeeikdkgiae

Anyway, that's my 2 cents. :P

• not available for Linux :-( –  david.perez Mar 3, 2020 at 14:52

You must log in to answer this question.

Not the answer you're looking for browse other questions tagged browser ..

• The Overflow Blog
• Is GenAI the next dot-com bubble?
• Featured on Meta
• New Focus Styles & Updated Styling for Button Groups
• Upcoming initiatives on Stack Overflow and across the Stack Exchange network
• Google Cloud will be Sponsoring Super User SE

Hot Network Questions

• Any possible exceptions/ways to (code compliant) put communication wire in same EMT as line voltage?
• Questioning why LVM for the OS Disks in cloud environments is not recommended
• Why is home ownership so low in Switzerland?
• Once a congressional bill has become law, how is it noticed by and overseen within the executive branch?
• Is it a cartesian product?
• How many lands in total can be put into play with Map the Frontier?
• Linear condition between two continuous variables
• What's the purpose of Wormskin Folios?
• Can a function have a set as its value?
• When is money first mentioned in Holy Scriptures?
• Wraping rope (paper chord) around object like wishbone chair
• Why is "creating jobs" seen as good and "destroying jobs" seen as bad, even when there are major labour shortages?
• Why does no historian speak of the torn veil and how do we reconcile it with scripture?
• How do objects reach terminal velocity?
• What would be the grounds for the US Chamber of Commerce to sue the FTC over its new rule concerning noncompetes?
• Finding food on the run
• How Do I Explain "Be Born"?
• Jawohl answer when someone knocks at the door
• How to find a co-author for a paper I can’t complete?
• Weave two lists, cycling if necessary
• What is a good approach to split 3 years of hourly data in a train, validation and test set for an electricity price forecasting neural network?
• Where can I get an earth-centric map of space?
• JQ returns json lines without commas
• How can I blend 3 images in GIMP, where each image provides an equal HSV contribution?

How-To Geek

How to customize the safari toolbar on your mac.

If you use Safari as the default browser on your Mac, you should take some time to customize the Safari toolbar to improve your productivity.

Quick Links

Why should you customize the safari toolbar, how to customize the safari toolbar.

Safari on the Mac features a minimal interface. Although you don't have a lot of room for customization or theming, you can change the toolbar buttons to suit your productivity style. Here's how to make the Safari toolbar look and work the way you want it to.

By default, the Safari toolbar shows all your enabled extension icons along with the URL bar and navigation buttons.

If you have a lot of extensions, you might want to hide some from the toolbar. You might also want to disable the Sidebar button or the Share button if you're going for a cleaner look.

When you go to customize the Safari toolbar, you'll find a new set of buttons that you can add to the toolbar. Shortcuts such as iCloud Tabs, Top Sites, Home, History, Bookmarks, Zoom, Mail, Print, Web Inspector, and so on.

For a pro user who doesn't like using keyboard shortcuts, fast access to features like Bookmarks and History can be incredibly useful. If you're a web developer, the same goes for the Web Inspector tool.

Related: Mac Users Should Ditch Google Chrome for Safari

Now that we've answered the why, let's get to the how. You can customize the Safari toolbar to your liking by first clicking "View" from the menu bar and then selecting "Customize Toolbar."

This will open a drop-down menu with a visual customization tool for the toolbar. You'll notice that all the icons in the toolbar start to jiggle, signaling that you can now move them around if you like. If you've tried reorganizing your iPhone or iPad home screen , you'll be familiar with this interface.

In the top part of the customization menu, you'll see a list of all available buttons. This is where you'll find new buttons like History or Bookmarks. If you want to add one of these buttons to the toolbar, click on the button, and drag it to the toolbar.

If you want to remove a button, click and drag the icon out of the toolbar area.

You can also customize the look of your Safari toolbar by adding some empty space. Click on the "Flexible space" button---located in the last row---and drag it into the toolbar.

To remove flexible space, click and drag it out of the toolbar.

Now that you understand how every element works, feel free to play around to get the Safari toolbar to look and feel just the way you like it.

How To Open Developer Tools On Safari

• Software & Applications
• Browsers & Extensions

Introduction

Opening developer tools in a web browser is a fundamental skill for anyone involved in web development, debugging, or troubleshooting website issues. Developer tools, also known as DevTools, provide a suite of powerful features that allow you to inspect and modify the structure and layout of a web page, analyze network activity, debug JavaScript, and much more. In this article, we will explore how to open developer tools specifically in the Safari web browser.

Safari, known for its sleek interface and robust performance, offers multiple methods to access its developer tools. Whether you prefer using the menu bar, keyboard shortcuts, or the context menu, Safari provides convenient options to suit your workflow. By mastering these methods, you can seamlessly integrate developer tools into your web development process, enhancing your efficiency and productivity.

In the following sections, we will delve into each method, providing step-by-step instructions and tips to ensure a smooth experience. Whether you are a seasoned web developer or just starting your journey, understanding how to open developer tools in Safari is a valuable skill that can empower you to create, debug, and optimize websites with confidence. Let's embark on this exploration and unlock the potential of Safari's developer tools together.

Method 1: Using the Menu Bar

Opening developer tools in Safari using the menu bar is a straightforward and reliable method. This approach is particularly useful for users who prefer navigating through familiar menu options to access essential browser features. Here's how you can effortlessly open developer tools using the menu bar:

Launch Safari : Begin by opening the Safari web browser on your Mac or iOS device. Ensure that you are running the latest version of Safari to access the most advanced developer tools and features.

Navigate to the Menu Bar : Look at the top of your screen for the menu bar. You will find the menu options such as "File," "Edit," "View," "History," "Bookmarks," "Develop," "Window," and "Help."

Access the "Develop" Menu : Click on the "Develop" option in the menu bar. If you don't see the "Develop" menu, you may need to enable it first. To do this, go to "Safari" > "Preferences" > "Advanced" and check the box next to "Show Develop menu in menu bar."

Open Developer Tools : Once you have accessed the "Develop" menu, you will find a list of options, including "Show Web Inspector." Click on "Show Web Inspector," and the developer tools panel will appear, providing you with a comprehensive set of tools to analyze and modify web pages.

Explore the Developer Tools : With the developer tools now open, take a moment to familiarize yourself with the various tabs and features available. You can inspect the HTML and CSS of the web page, analyze network activity, debug JavaScript, and much more.

By utilizing the menu bar to access developer tools in Safari, you can seamlessly integrate this essential feature into your web development workflow. This method provides a convenient and intuitive way to leverage the power of Safari's developer tools, empowering you to create, debug, and optimize websites with precision and efficiency.

Method 2: Using Keyboard Shortcuts

Harnessing the power of keyboard shortcuts is a time-saving and efficient way to access developer tools in Safari. By memorizing and utilizing these shortcuts, you can seamlessly integrate developer tools into your web development workflow, enhancing your productivity and efficiency. Here's how you can effortlessly open developer tools using keyboard shortcuts:

Initiate Keyboard Shortcut : To open the developer tools using a keyboard shortcut, simply press "Option + Command + I" on your Mac keyboard . Alternatively, you can use "Option + Command + C" to open the developer tools and immediately activate the cursor for inspecting elements on the web page.

Access Developer Tools : Upon executing the keyboard shortcut, the developer tools panel will swiftly appear, providing you with a comprehensive set of tools to inspect, debug, and optimize web pages. This rapid access to developer tools streamlines your workflow, allowing you to delve into web page elements and network activity without interrupting your creative momentum.

Navigate with Ease : With the developer tools now open, take a moment to explore the various tabs and features available. You can effortlessly navigate through the Elements, Console, Sources, Network, and other panels using the keyboard or mouse, gaining valuable insights into the structure and behavior of the web page.

By leveraging keyboard shortcuts to access developer tools in Safari, you can seamlessly integrate this essential feature into your web development process. The intuitive and rapid nature of keyboard shortcuts empowers you to swiftly analyze and modify web pages, debug JavaScript, and optimize website performance with precision and speed. Embracing these shortcuts as part of your web development toolkit can elevate your proficiency and effectiveness, enabling you to create exceptional web experiences with ease.

Method 3: Using the Context Menu

Utilizing the context menu to access developer tools in Safari offers a convenient and efficient method, particularly for users who prefer a streamlined approach to web development. By leveraging the context menu, you can seamlessly open the developer tools directly from the web page, eliminating the need to navigate through multiple menu options. Here's a detailed exploration of how you can effortlessly open developer tools using the context menu:

Navigate to the Web Page : Visit the web page that you intend to inspect and analyze using the developer tools. Whether it's your own website, a client's project, or a site you're troubleshooting, the context menu provides a swift pathway to accessing the developer tools.

Right-click on the Web Page : Once you are on the web page, right-click (or control-click) anywhere on the page to reveal the context menu. This menu typically offers a range of options related to the content and functionality of the web page.

Access the "Inspect Element" Option : Within the context menu, look for the option labeled "Inspect Element" or a similar variation. Click on this option, and the developer tools panel will promptly appear, providing you with a comprehensive set of tools to inspect and modify the web page's structure and behavior.

Explore the Developer Tools : With the developer tools now open, take a moment to explore the various tabs and features available. You can inspect and modify the HTML and CSS of the web page, analyze network activity, debug JavaScript, and much more, all within the context of the specific elements you've chosen to inspect.

By leveraging the context menu to access developer tools in Safari, you can seamlessly integrate this essential feature into your web development workflow. This method offers a direct and intuitive pathway to swiftly analyze and modify web pages, empowering you to gain valuable insights and optimize website performance with precision and ease. Embracing the context menu as part of your web development toolkit can elevate your proficiency and effectiveness, enabling you to create exceptional web experiences with seamless accessibility to developer tools.

In conclusion, mastering the art of opening developer tools in Safari is a valuable skill that can significantly enhance your web development capabilities. By exploring the various methods to access developer tools, including using the menu bar, keyboard shortcuts, and the context menu, you can seamlessly integrate this essential feature into your workflow, empowering you to create, debug, and optimize websites with precision and efficiency.

Whether you prefer the familiarity of navigating through the menu bar, the rapid accessibility of keyboard shortcuts, or the streamlined efficiency of the context menu, Safari offers versatile options to suit your preferences and workflow. Each method provides a seamless pathway to unlock the powerful suite of developer tools, enabling you to inspect and modify web pages, analyze network activity, debug JavaScript, and much more.

By leveraging the menu bar, users can rely on the intuitive navigation to access developer tools, seamlessly integrating this essential feature into their web development process. The convenience of using familiar menu options ensures a smooth transition into the world of web page inspection and modification.

Embracing keyboard shortcuts as part of your web development toolkit can elevate your proficiency and effectiveness, enabling you to swiftly analyze and modify web pages, debug JavaScript, and optimize website performance with precision and speed. The rapid access to developer tools streamlines your workflow, allowing you to delve into web page elements and network activity without interrupting your creative momentum.

Utilizing the context menu to access developer tools offers a direct and intuitive pathway to swiftly analyze and modify web pages, empowering you to gain valuable insights and optimize website performance with precision and ease. This method eliminates the need to navigate through multiple menu options, providing a streamlined approach to web development.

In essence, understanding how to open developer tools in Safari is a foundational skill that can empower you to create exceptional web experiences. By seamlessly integrating developer tools into your web development process, you gain the ability to inspect, debug, and optimize websites with confidence, ultimately enhancing the quality and performance of your web projects. Embrace the versatility of Safari's developer tools and unlock the potential to elevate your web development capabilities.

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Save my name, email, and website in this browser for the next time I comment.

• Crowdfunding
• Cryptocurrency
• Digital Banking
• Digital Payments
• Investments
• Console Gaming
• Mobile Gaming
• VR/AR Gaming
• Gadget Usage
• Gaming Tips
• Online Safety
• Software Tutorials
• Tech Setup & Troubleshooting
• Buyer’s Guides
• Comparative Analysis
• Gadget Reviews
• Service Reviews
• Software Reviews
• Mobile Devices
• PCs & Laptops
• Smart Home Gadgets
• Content Creation Tools
• Digital Photography
• Video & Music Streaming
• Online Security
• Online Services
• Web Hosting
• WiFi & Ethernet
• Browsers & Extensions
• Communication Platforms
• Operating Systems
• Productivity Tools
• AI & Machine Learning
• Cybersecurity
• Emerging Tech
• IoT & Smart Devices
• Virtual & Augmented Reality
• Latest News
• AI Developments
• Fintech Updates
• Gaming News
• New Product Launches

• Fintechs and Traditional Banks Navigating the Future of Financial Services
• AI Writing How Its Changing the Way We Create Content

Related Post

How to find the best midjourney alternative in 2024: a guide to ai anime generators, unleashing young geniuses: how lingokids makes learning a blast, 10 best ai math solvers for instant homework solutions, 10 best ai homework helper tools to get instant homework help, 10 best ai humanizers to humanize ai text with ease, sla network: benefits, advantages, satisfaction of both parties to the contract, related posts.

How To Enable Inspect In Safari

How To Open Developer Tools In Safari

How To Inspect Page On Safari

How To Inspect On IPhone Safari

How To Change Location In Safari

How To Post On Instagram From Mac Safari

How To Inspect On Safari IPhone

How To Reset Safari 9.0

Recent stories.

Fintechs and Traditional Banks: Navigating the Future of Financial Services

AI Writing: How It’s Changing the Way We Create Content

How to Know When it’s the Right Time to Buy Bitcoin

How to Sell Counter-Strike 2 Skins Instantly? A Comprehensive Guide

10 Proven Ways For Online Gamers To Avoid Cyber Attacks And Scams

• Privacy Overview
• Strictly Necessary Cookies

This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.

Strictly Necessary Cookie should be enabled at all times so that we can save your preferences for cookie settings.

If you disable this cookie, we will not be able to save your preferences. This means that every time you visit this website you will need to enable or disable cookies again.

Simulate different devices and screen sizes

All browser DevTools have a built-in mode that you can use to test a webpage under different screen sizes and device capabilities.

As a web developer, it is very important to realize that your website won't only be used on one type of device. People browse the web with many different device types, from small phones, to large desktop monitors, and everything in between.

Not only do the devices people use have different screen sizes, but they can also have different pixel densities, support for touch input, network speeds, and more.

Browser DevTools make it easy to simulate how a webpage might render under different screen sizes and device capabilities. However, note that this is only a simulation , and you should always test your webpage on the real device too. For example, even if the device mode in Chrome DevTools lets you simulate an iPhone screen, it doesn't actually render the webpage with the same rendering engine as the iPhone would. So, always test on the real device too.

Available features #

This simulation mode comes with the following features (more might be available depending on the browser you're using):

• Resize the simulated viewport size by hand.
• Choose one of the pre-defined devices to simulate.
• Create your own simulated devices .
• Capture screenshots .
• Throttle the network speed to test your website on slower connections .

Start simulating #

In chrome #.

To enable the device mode in Chrome DevTools, click the Toggle Device Toolbar button or press Ctrl+Shift+M (or Cmd+Shift+M on macOS).

To enable the device mode in Edge DevTools, click the Toggle device emulation button or press Ctrl+Shift+M (or Cmd+Shift+M on macOS).

In Firefox #

In Firefox, you don't need DevTools to be opened to simulate devices. Click Open application menu > More tools > Responsive design mode , or press Ctrl+Shift+M (or Cmd+Shift+M on macOS).

Or, if you're in DevTools, click the Responsive Design Mode button, or press Ctrl+Shift+M (or Cmd+Shift+M on macOS).

In Safari #

In Safari, you don't need DevTools to be opened to simulate devices. Click Develop in Safari's menu bar, and then click Enter Responsive Design Mode , or press Ctrl+Command+R .

If you aren't seeing the Develop menu item, enable it first (this only needs to be done once):

• In Safari, in the menu bar, go to Safari > Settings .
• Select the Advanced tab.
• Click Show features for web developers .

In Polypane #

Simulating different screen sizes is Polypane's default behavior. Polypane is the only browser DevTools that allows you to see multiple screen sizes side by side too. To learn more, see Simulate multiple devices that are kept in sync .

Last edit: 10/19/2022 - Edit this page

Mac: How to customize your Safari toolbar

Whether you’re new to Mac or it’s been a while since you’ve adjusted the toolbar in Safari, follow along below for how to customize yours.

Having your Safari toolbar dialed in to best suit your needs makes for a more efficient and pleasant browsing experience. We’ll also look at how to reset the toolbar to the default setting if you’d like to start fresh.

The toolbar doesn’t take more than a minute or two to curate, so let’s get to it 😄.

• Open Safari
• Click  View at the top of your screen in the menu bar
• Select  Customize Toolbar…
• Drag and drop items into your toolbar as you’d like

To remove items, you can drag them out of the toolbar and let go.

You can also return your toolbar to the Safari default by dragging that option from the bottom the toolbar customization window as shown below.

For more help getting the most out of your Apple devices, check out our how to guide as well as the following articles:

• iPhone: How to enable or disable read receipts for iMessage
• iPhone & iPad: How to customize calendar settings
• How to use Light Mode for messages in Mail with Dark Mode on macOS Mojave
• How to customize Voice Feedback for Siri
• iPhone & iPad: How to customize Siri suggestions
• iPhone & iPad: How to customize keyboard shortcuts
• How to find Mac keyboard shortcuts
• iPhone & iPad: How to change language and region
• Mac: How to change your language and region

Check out 9to5Mac on YouTube for more Apple news:

FTC: We use income earning auto affiliate links. More.

Apple’s Mac lineup consists of MacBook, MacBoo…

A collection of tutorials, tips, and tricks from…

Michael is an editor for 9to5Mac. Since joining in 2016 he has written more than 3,000 articles including breaking news, reviews, and detailed comparisons and tutorials.

Michael Potuck's favorite gear

Satechi USB-C Charger (4 ports)

Really useful USB-C + USB-A charger for home/work and travel.

Apple Leather MagSafe Wallet

My slim wallet of choice for iPhone 12

Manage push notifications

Tips & Tricks

Troubleshooting, how to customize safari toolbar on mac.

Do you use Safari to browse the web regularly on your Mac? If so, you’ll be excited to know that you can customize Safari’s toolbar just the way you want by adding or removing certain items from it.

Safari is the default web browser on macOS devices and it’s widely used by Mac users, over Google Chrome, Firefox, Opera etc. By default, Safari features buttons to go back/forward, view sidebar, share, tab overview, and of course the address and search bar. However, this can be completely changed according to the features you mostly use. For example, you can add a bookmarks option to the toolbar. Or perhaps, a print option if you often print pages from the web.

If you’re interested in changing the Safari Toolbar to better suit your web browsing, read on to learn how to customize it on the Mac.

Changing your Safari toolbar functionality is a lot easier than you may think. Just follow the steps below to interchange the items that show up in the toolbar.

There you have it, you have customized the Safari toolbar on your Mac.

Apart from adding items to the Safari toolbar, you can also customize your browser window with Favorites bar, Tab bar, and Status bar. To add them, simply click on “View” in the menu bar and choose to show these bars from the dropdown menu.

Another handy trick for many users, particularly advanced web users, is to make Safari show the full URL of website addresses , so that you can see the complete link of any site you’re browsing.

You can also customize the Safari Start Page if you’d like to.

Furthermore, you can take advantage of various keyboard shortcuts to quickly show or hide bookmarks, reading lists, and status bars in Safari too. If you aren’t familiar with Safari’s keyboard shortcuts, you can see some handy ones here , and you’ll also be able to find them in the dropdown menu of various options in the menu bar.

It’s worth mentioning that the ability to customize the toolbar has been in Safari for a very long time, so it does not matter which version of macOS (or Mac OS X) you’re using, the feature will be there. Some particular features are specific to newer Mac OS versions however, like the privacy report .

Did you customize the toolbar in Safari for Mac? Or do you think it’s perfect as it is by default? Share your thoughts, opinions, tips, advice, or whatever else is relevant and on your mind in the comments.

Enjoy this tip? Subscribe to our newsletter!

Get more of our great Apple tips, tricks, and important news delivered to your inbox with the OSXDaily newsletter. 

You have successfully joined our subscriber list.

Related articles:

• Add Items to the Mac Finder Window Toolbar with a Drag & Drop Trick
• How to Add Apps to MacOS Finder Toolbar
• How to Turn Off Split Screen in Safari for iPad? Exiting Safari Split Screen in iPadOS
• How to Customize Safari Start Page on Mac

Leave a Reply

Name (required)

Mail (will not be published) (required)

Subscribe to OSXDaily

• - How to Uninstall Apps on MacOS Sonoma & Ventura via System Settings
• - How to Mute a Call on Apple Watch
• - How to Use the Latest GPT 4 & DALL-E 3 Free on iPhone & iPad with Copilot
• - 15 Mail Keyboard Shortcuts for Mac
• - How to Use Hover Text on Mac to Magnify On-Screen Text
• - Apple Event Set for May 7, New iPads Expected
• - Beta 2 of iOS 17.5, iPadOS 17.5, macOS Sonoma 14.5, Available for Testing
• - Opinion: Shiny Keys on MacBook Air & Pro Are Ugly and Shouldn’t Happen
• - MacOS Ventura 13.6.6 & Safari 17.4.1 Update Available
• - Using M3 MacBook Air in Clamshell Mode May Reduce Performance

iPhone / iPad

• - How to Bulk Image Edit on iPhone & iPad wth Copy & Paste Edits to Photos
• - What Does the Bell with Line Through It Mean in Messages? Bell Icon on iPhone, iPad, & Mac Explained
• - iOS 16.7.7 & iPadOS 16.7.7 Released for Older iPhone & iPad Models
• - Fix a Repeating “Trust This Computer” Alert on iPhone & iPad
• - Make a Website Your Mac Wallpaper with Plash
• - The Best Way to Clean a MacBook Air Keyboard: Microfiber Cloth & KeyboardCleanTool
• - Fix “warning: unable to access /Users/Name/.config/git/attributes Permission Denied” Errors
• - How to Fix the Apple Watch Squiggly Charging Cable Screen
• - NewsToday2: What it is & How to Disable NewsToday2 on Mac

About OSXDaily | Contact Us | Privacy Policy | Sitemap

This website is unrelated to Apple Inc

All trademarks and copyrights on this website are property of their respective owners.

© 2024 OS X Daily. All Rights Reserved. Reproduction without explicit permission is prohibited.

iPhone User Guide

• iPhone models compatible with iOS 17
• R ' class='toc-item' data-ss-analytics-link-url='https://support.apple.com/guide/iphone/iphone-xr-iph017302841/ios' data-ajax-endpoint='https://support.apple.com/guide/iphone/iphone-xr-iph017302841/ios' data-ss-analytics-event="acs.link_click" href='https://support.apple.com/guide/iphone/iphone-xr-iph017302841/ios' id='toc-item-IPH017302841' data-tocid='IPH017302841' > iPhone X R
• S ' class='toc-item' data-ss-analytics-link-url='https://support.apple.com/guide/iphone/iphone-xs-iphc00446242/ios' data-ajax-endpoint='https://support.apple.com/guide/iphone/iphone-xs-iphc00446242/ios' data-ss-analytics-event="acs.link_click" href='https://support.apple.com/guide/iphone/iphone-xs-iphc00446242/ios' id='toc-item-IPHC00446242' data-tocid='IPHC00446242' > iPhone X S
• S Max' class='toc-item' data-ss-analytics-link-url='https://support.apple.com/guide/iphone/iphone-xs-max-iphcd2066870/ios' data-ajax-endpoint='https://support.apple.com/guide/iphone/iphone-xs-max-iphcd2066870/ios' data-ss-analytics-event="acs.link_click" href='https://support.apple.com/guide/iphone/iphone-xs-max-iphcd2066870/ios' id='toc-item-IPHCD2066870' data-tocid='IPHCD2066870' > iPhone X S Max
• iPhone 11 Pro
• iPhone 11 Pro Max
• iPhone SE (2nd generation)
• iPhone 12 mini
• iPhone 12 Pro
• iPhone 12 Pro Max
• iPhone 13 mini
• iPhone 13 Pro
• iPhone 13 Pro Max
• iPhone SE (3rd generation)
• iPhone 14 Plus
• iPhone 14 Pro
• iPhone 14 Pro Max
• iPhone 15 Plus
• iPhone 15 Pro
• iPhone 15 Pro Max
• Setup basics
• Make your iPhone your own
• Take great photos and videos
• Keep in touch with friends and family
• Share features with your family
• Use iPhone for your daily routines
• Expert advice from Apple Support
• What’s new in iOS 17
• Turn on and set up iPhone
• Wake and unlock
• Set up cellular service
• Use Dual SIM
• Connect to the internet
• Sign in with Apple ID
• Subscribe to iCloud+
• Find settings
• Set up mail, contacts, and calendar accounts
• Learn the meaning of the status icons
• Charge the battery
• Charge with cleaner energy sources
• Show the battery percentage
• Check battery health and usage
• Use Low Power Mode
• Read and bookmark the user guide
• Learn basic gestures
• Learn gestures for iPhone models with Face ID
• Adjust the volume
• Find your apps in App Library
• Switch between open apps
• Quit and reopen an app
• Multitask with Picture in Picture
• Access features from the Lock Screen
• View Live Activities in the Dynamic Island
• Perform quick actions
• Search on iPhone
• Get information about your iPhone
• View or change cellular data settings
• Travel with iPhone
• Change sounds and vibrations
• Use the Action button on iPhone 15 Pro and iPhone 15 Pro Max
• Create a custom Lock Screen
• Change the wallpaper
• Adjust the screen brightness and color balance
• Keep the iPhone display on longer
• Use StandBy
• Customize the text size and zoom setting
• Change the name of your iPhone
• Change the date and time
• Change the language and region
• Organize your apps in folders
• Add, edit, and remove widgets
• Move apps and widgets on the Home Screen
• Remove apps
• Use and customize Control Center
• Change or lock the screen orientation
• View and respond to notifications
• Change notification settings
• Set up a Focus
• Allow or silence notifications for a Focus
• Turn a Focus on or off
• Stay focused while driving
• Customize sharing options
• Type with the onscreen keyboard
• Dictate text
• Select and edit text
• Use predictive text
• Use text replacements
• Add or change keyboards
• Add emoji and stickers
• Take a screenshot
• Take a screen recording
• Draw in documents
• Add text, shapes, signatures, and more
• Fill out forms and sign documents
• Use Live Text to interact with content in a photo or video
• Use Visual Look Up to identify objects in your photos and videos
• Lift a subject from the photo background
• Subscribe to Apple Arcade
• Play with friends in Game Center
• Connect a game controller
• Use App Clips
• Update apps
• View or cancel subscriptions
• Manage purchases, settings, and restrictions
• Install and manage fonts
• Buy books and audiobooks
• Annotate books
• Access books on other Apple devices
• Listen to audiobooks
• Set reading goals
• Organize books
• Create and edit events in Calendar
• Send invitations
• Reply to invitations
• Change how you view events
• Search for events
• Change calendar and event settings
• Schedule or display events in a different time zone
• Keep track of events
• Use multiple calendars
• Use the Holidays calendar
• Share iCloud calendars
• Camera basics
• Set up your shot
• Apply Photographic Styles
• Take Live Photos
• Take Burst mode shots
• Take a selfie
• Take panoramic photos
• Take macro photos and videos
• Take portraits
• Take Night mode photos
• Take Apple ProRAW photos
• Adjust the shutter volume
• Adjust HDR camera settings
• Record videos
• Record spatial videos for Apple Vision Pro
• Record ProRes videos
• Record videos in Cinematic mode
• Change video recording settings
• Save camera settings
• Customize the Main camera lens
• Change advanced camera settings
• View, share, and print photos
• Use Live Text
• Scan a QR code
• See the world clock
• Set an alarm
• Change the next wake up alarm
• Use the stopwatch
• Use multiple timers
• Add and use contact information
• Edit contacts
• Add your contact info
• Use NameDrop on iPhone to share your contact info
• Use other contact accounts
• Use Contacts from the Phone app
• Merge or hide duplicate contacts
• Export contacts
• Get started with FaceTime
• Make FaceTime calls
• Receive FaceTime calls
• Create a FaceTime link
• Take a Live Photo
• Turn on Live Captions in a FaceTime call
• Use other apps during a call
• Make a Group FaceTime call
• View participants in a grid
• Use SharePlay to watch, listen, and play together
• Share your screen in a FaceTime call
• Collaborate on a document in FaceTime
• Use video conferencing features
• Hand off a FaceTime call to another Apple device
• Change the FaceTime video settings
• Change the FaceTime audio settings
• Change your appearance
• Leave a call or switch to Messages
• Block unwanted callers
• Report a call as spam
• Connect external devices or servers
• Modify files, folders, and downloads
• Search for files and folders
• Organize files and folders
• Set up iCloud Drive
• Share files and folders in iCloud Drive
• Share your location
• Meet up with a friend
• Send your location via satellite
• Add or remove a friend
• Locate a friend
• Get notified when friends change their location
• Notify a friend when your location changes
• Add your iPhone
• Add your iPhone Wallet with MagSafe
• Get notified if you leave a device behind
• Locate a device
• Mark a device as lost
• Erase a device
• Remove a device
• Add an AirTag
• Share an AirTag or other item in Find My on iPhone
• Add a third-party item
• Get notified if you leave an item behind
• Locate an item
• Mark an item as lost
• Remove an item
• Adjust map settings
• Get started with Fitness
• Track daily activity and change your move goal
• See your activity summary
• Sync a third-party workout app
• Change fitness notifications
• Share your activity
• Subscribe to Apple Fitness+
• Find Apple Fitness+ workouts and meditations
• Start an Apple Fitness+ workout or meditation
• Create a Custom Plan in Apple Fitness+
• Work out together using SharePlay
• Change what’s on the screen during an Apple Fitness+ workout or meditation
• Download an Apple Fitness+ workout or meditation
• Get started with Freeform
• Create a Freeform board
• Draw or handwrite
• Apply consistent styles
• Position items on a board
• Search Freeform boards
• Share and collaborate
• Delete and recover boards
• Get started with Health
• Fill out your Health Details
• Intro to Health data
• View your health data
• Share your health data
• View health data shared by others
• Download health records
• View health records
• Monitor your walking steadiness
• Log menstrual cycle information
• View menstrual cycle predictions and history
• Track your medications
• Learn more about your medications
• Log your state of mind
• Take a mental health assessment
• Set up a schedule for a Sleep Focus
• Turn off alarms and delete sleep schedules
• Add or change sleep schedules
• Turn Sleep Focus on or off
• Change your wind down period, sleep goal, and more
• View your sleep history
• Check your headphone levels
• Use audiogram data
• Register as an organ donor
• Back up your Health data
• Intro to Home
• Upgrade to the new Home architecture
• Set up accessories
• Control accessories
• Control your home using Siri
• Use Grid Forecast to plan your energy usage
• Set up HomePod
• Control your home remotely
• Create and use scenes
• Use automations
• Set up security cameras
• Use Face Recognition
• Unlock your door with a home key
• Configure a router
• Invite others to control accessories
• Add more homes
• Get music, movies, and TV shows
• Get ringtones
• Manage purchases and settings
• Get started with Journal
• Write in your journal
• Review your past journal entries
• Change Journal settings
• Magnify nearby objects
• Change settings
• Detect people around you
• Detect doors around you
• Receive image descriptions of your surroundings
• Read aloud text and labels around you
• Set up shortcuts for Detection Mode
• Add and remove email accounts
• Set up a custom email domain
• Check your email
• Unsend email with Undo Send
• Reply to and forward emails
• Save an email draft
• Add email attachments
• Download email attachments
• Annotate email attachments
• Set email notifications
• Search for email
• Organize email in mailboxes
• Flag or block emails
• Filter emails
• Use Hide My Email
• Use Mail Privacy Protection
• Change email settings
• Delete and recover emails
• Add a Mail widget to your Home Screen
• Print emails
• Get travel directions
• Select other route options
• Find stops along your route
• View a route overview or a list of turns
• Change settings for spoken directions
• Get driving directions
• Get directions to your parked car
• Set up electric vehicle routing
• Report traffic incidents
• Get cycling directions
• Get walking directions
• Get transit directions
• Delete recent directions
• Get traffic and weather info
• Estimate travel time and ETA
• Download offline maps
• Search for places
• Find nearby attractions, restaurants, and services
• Get information about places
• Mark places
• Share places
• Rate places
• Save favorite places
• Explore new places with Guides
• Organize places in My Guides
• Delete significant locations
• Look around places
• Take Flyover tours
• Find your Maps settings
• Measure dimensions
• View and save measurements
• Measure a person’s height
• Use the level
• Set up Messages
• About iMessage
• Send and reply to messages
• Unsend and edit messages
• Keep track of messages
• Forward and share messages
• Group conversations
• Watch, listen, or play together using SharePlay
• Collaborate on projects
• Use iMessage apps
• Take and edit photos or videos
• Share photos, links, and more
• Send stickers
• Request, send, and receive payments
• Send and receive audio messages
• Animate messages
• Change notifications
• Block, filter, and report messages
• Delete messages and attachments
• Recover deleted messages
• View albums, playlists, and more
• Show song credits and lyrics
• Queue up your music
• Listen to broadcast radio
• Subscribe to Apple Music
• Play music together in the car with iPhone
• Listen to lossless music
• Listen to Dolby Atmos music
• Apple Music Sing
• Find new music
• Add music and listen offline
• Get personalized recommendations
• Listen to radio
• Search for music
• Create playlists
• See what your friends are listening to
• Use Siri to play music
• Change the way music sounds
• Get started with News
• Use News widgets
• See news stories chosen just for you
• Read stories
• Follow your favorite teams with My Sports
• Listen to Apple News Today
• Subscribe to Apple News+
• Browse and read Apple News+ stories and issues
• Download Apple News+ issues
• Listen to audio stories
• Solve crossword puzzles
• Search for news stories
• Save stories in News for later
• Subscribe to individual news channels
• Get started with Notes
• Add or remove accounts
• Create and format notes
• Draw or write
• Add photos, videos, and more
• Scan text and documents
• Work with PDFs
• Create Quick Notes
• Search notes
• Organize in folders
• Organize with tags
• Use Smart Folders
• Export or print notes
• Change Notes settings
• Make a call
• Answer or decline incoming calls
• While on a call
• Set up voicemail
• Check voicemail
• Change voicemail greeting and settings
• Select ringtones and vibrations
• Make calls using Wi-Fi
• Set up call forwarding and call waiting
• Avoid unwanted calls
• View photos and videos
• Play videos and slideshows
• Delete or hide photos and videos
• Edit photos and videos
• Trim video length and adjust slow motion
• Edit Cinematic mode videos
• Edit Live Photos
• Edit portraits
• Use photo albums
• Edit, share, and organize albums
• Filter and sort photos and videos in albums
• Make stickers from your photos
• Duplicate and copy photos and videos
• Merge duplicate photos and videos
• Search for photos
• Identify people and pets
• Browse photos by location
• Share photos and videos
• Share long videos
• View photos and videos shared with you
• Watch memories
• Personalize your memories
• Manage memories and featured photos
• Use iCloud Photos
• Create shared albums
• Add and remove people in a shared album
• Add and delete photos and videos in a shared album
• Set up or join an iCloud Shared Photo Library
• Add content to an iCloud Shared Photo Library
• Use iCloud Shared Photo Library
• Import and export photos and videos
• Print photos
• Find podcasts
• Listen to podcasts
• Follow your favorite podcasts
• Use the Podcasts widget
• Organize your podcast library
• Download, save, or share podcasts
• Subscribe to podcasts
• Listen to subscriber-only content
• Change download settings
• Make a grocery list
• Add items to a list
• Edit and manage a list
• Search and organize lists
• Work with templates
• Use Smart Lists
• Print reminders
• Use the Reminders widget
• Change Reminders settings
• Browse the web
• Search for websites
• Customize your Safari settings
• Change the layout
• Use Safari profiles
• Open and close tabs
• Organize your tabs
• View your Safari tabs from another Apple device
• Share Tab Groups
• Use Siri to listen to a webpage
• Bookmark favorite webpages
• Save pages to a Reading List
• Find links shared with you
• Annotate and save a webpage as a PDF
• Automatically fill in forms
• Get extensions
• Hide ads and distractions
• Clear your cache
• Browse the web privately
• Use passkeys in Safari
• Check stocks
• Manage multiple watchlists
• Read business news
• Add earnings reports to your calendar
• Use a Stocks widget
• Translate text, voice, and conversations
• Translate text in apps
• Translate with the camera view
• Subscribe to Apple TV+, MLS Season Pass, or an Apple TV channel
• Add your TV provider
• Get shows, movies, and more
• Watch sports
• Watch Major League Soccer with MLS Season Pass
• Control playback
• Manage your library
• Change the settings
• Make a recording
• Play it back
• Edit or delete a recording
• Keep recordings up to date
• Organize recordings
• Search for or rename a recording
• Share a recording
• Duplicate a recording
• Keep cards and passes in Wallet
• Set up Apple Pay
• Use Apple Pay for contactless payments
• Use Apple Pay in apps and on the web
• Track your orders
• Use Apple Cash
• Use Apple Card
• Use Savings
• Pay for transit
• Access your home, hotel room, and vehicle
• Add identity cards
• Use COVID-19 vaccination cards
• Check your Apple Account balance
• Use Express Mode
• Organize your Wallet
• Remove cards or passes
• Check the weather
• Check the weather in other locations
• View weather maps
• Manage weather notifications
• Use Weather widgets
• Learn the weather icons
• Find out what Siri can do
• Tell Siri about yourself
• Have Siri announce calls and notifications
• Add Siri Shortcuts
• About Siri Suggestions
• Use Siri in your car
• Change Siri settings
• Contact emergency services
• Use Emergency SOS via satellite
• Request Roadside Assistance via satellite
• Set up and view your Medical ID
• Use Check In
• Manage Crash Detection
• Reset privacy and security settings in an emergency
• Set up Family Sharing
• Add Family Sharing members
• Remove Family Sharing members
• Share subscriptions
• Share purchases
• Share locations with family and locate lost devices
• Set up Apple Cash Family and Apple Card Family
• Set up parental controls
• Set up a child’s device
• Get started with Screen Time
• Protect your vision health with Screen Distance
• Set up Screen Time
• Set communication and safety limits and block inappropriate content
• Charging cable
• Power adapters
• MagSafe chargers and battery packs
• MagSafe cases and sleeves
• Qi-certified wireless chargers
• Use AirPods
• Use EarPods
• Apple Watch
• Wirelessly stream videos and photos to Apple TV or a smart TV
• Connect to a display with a cable
• HomePod and other wireless speakers
• Pair Magic Keyboard
• Enter characters with diacritical marks
• Switch between keyboards
• Use shortcuts
• Choose an alternative keyboard layout
• Change typing assistance options
• External storage devices
• Bluetooth accessories
• Share your internet connection
• Allow phone calls on your iPad and Mac
• Use iPhone as a webcam
• Hand off tasks between devices
• Cut, copy, and paste between iPhone and other devices
• Stream video or mirror the screen of your iPhone
• Start SharePlay instantly
• Use AirDrop to send items
• Connect iPhone and your computer with a cable
• Transfer files between devices
• Transfer files with email, messages, or AirDrop
• Transfer files or sync content with the Finder or iTunes
• Automatically keep files up to date with iCloud
• Use an external storage device, a file server, or a cloud storage service
• Intro to CarPlay
• Connect to CarPlay
• Use your vehicle’s built-in controls
• Get turn-by-turn directions
• Change the map view
• Make phone calls
• View your calendar
• Send and receive text messages
• Announce incoming text messages
• Play podcasts
• Play audiobooks
• Listen to news stories
• Control your home
• Use other apps with CarPlay
• Rearrange icons on CarPlay Home
• Change settings in CarPlay
• Get started with accessibility features
• Turn on accessibility features for setup
• Change Siri accessibility settings
• Open features with Accessibility Shortcut
• Change color and brightness
• Make text easier to read
• Reduce onscreen motion
• Customize per-app visual settings
• Hear what’s on the screen or typed
• Hear audio descriptions
• Turn on and practice VoiceOver
• Change your VoiceOver settings
• Use VoiceOver gestures
• Operate iPhone when VoiceOver is on
• Control VoiceOver using the rotor
• Use the onscreen keyboard
• Write with your finger
• Use VoiceOver with an Apple external keyboard
• Use a braille display
• Type braille on the screen
• Customize gestures and keyboard shortcuts
• Use VoiceOver with a pointer device
• Use VoiceOver for images and videos
• Use VoiceOver in apps
• Use AssistiveTouch
• Adjust how iPhone responds to your touch
• Use Reachability
• Auto-answer calls
• Turn off vibration
• Change Face ID and attention settings
• Use Voice Control
• Adjust the side or Home button
• Use Apple TV Remote buttons
• Adjust pointer settings
• Adjust keyboard settings
• Adjust AirPods settings
• Turn on Apple Watch Mirroring
• Control a nearby Apple device
• Intro to Switch Control
• Set up and turn on Switch Control
• Select items, perform actions, and more
• Control several devices with one switch
• Use hearing devices
• Use Live Listen
• Use sound recognition
• Set up and use RTT and TTY
• Flash the LED for alerts
• Adjust audio settings
• Play background sounds
• Display subtitles and captions
• Show transcriptions for Intercom messages
• Get Live Captions (beta)
• Type to speak
• Record a Personal Voice
• Use Guided Access
• Use built-in privacy and security protections
• Set a passcode
• Set up Face ID
• Set up Touch ID
• Control access to information on the Lock Screen
• Keep your Apple ID secure
• Use passkeys to sign in to apps and websites
• Sign in with Apple
• Share passwords
• Automatically fill in strong passwords
• Change weak or compromised passwords
• View your passwords and related information
• Share passkeys and passwords securely with AirDrop
• Make your passkeys and passwords available on all your devices
• Automatically fill in verification codes
• Automatically fill in SMS passcodes
• Sign in with fewer CAPTCHA challenges
• Use two-factor authentication
• Use security keys
• Manage information sharing with Safety Check
• Control app tracking permissions
• Control the location information you share
• Control access to information in apps
• Control how Apple delivers advertising to you
• Control access to hardware features
• Create and manage Hide My Email addresses
• Protect your web browsing with iCloud Private Relay
• Use a private network address
• Use Advanced Data Protection
• Use Lockdown Mode
• Use Stolen Device Protection
• Receive warnings about sensitive content
• Use Contact Key Verification
• Turn iPhone on or off
• Force restart iPhone
• Back up iPhone
• Return iPhone settings to their defaults
• Restore all content from a backup
• Restore purchased and deleted items
• Sell, give away, or trade in your iPhone
• Erase iPhone
• Install or remove configuration profiles
• Important safety information
• Important handling information
• Find more resources for software and service
• FCC compliance statement
• ISED Canada compliance statement
• Ultra Wideband information
• Class 1 Laser information
• Apple and the environment
• Disposal and recycling information
• Unauthorized modification of iOS

Customize your Safari settings on iPhone

Customize your start page

When you open a new tab, you begin on your start page. You can customize your start page with new background images and options.

Scroll to the bottom of the page, then tap Edit.

Choose the options you want to appear on your start page:

Favorites: Display shortcuts to your favorite bookmarked websites. See Bookmark a favorite website .

Frequently Visited: Go straight to the websites you visit most.

Shared with You: See links shared with you in Messages, Mail, and more. See Find links shared with you .

Privacy Report: Stay updated on how many trackers and websites Safari blocked from tracking you. See View the Privacy Report .

Siri Suggestions: As you search, allow websites shared in Calendar and other apps to appear.

Reading List: Show webpages currently in your Reading List. See Add the current webpage to your Reading List .

Recently Closed Tabs: Go back to tabs you previously closed.

iCloud Tabs: Show open tabs from other Apple devices where you’re signed in with the same Apple ID and Safari is turned on in iCloud settings or preferences. See Organize your tabs with Tab Groups .

Note: Your custom start page settings are updated on all your Apple devices where you have Use Start Page on All Devices turned on, and you’re signed in with the same Apple ID using two-factor authentication .

Change the text size for a website on Safari

Use the Page Settings button to increase or decrease the text size.

Tap the large A to increase the font size or the small A to decrease it.

Change the display controls for a website on Safari

You can hide the search field, switch to Reader, and more.

Hide the search field: Tap Hide Toolbar (tap the bottom of the screen to get it back).

See a streamlined view of the webpage: Tap Show Reader (if available).

To return to the normal view, tap Hide Reader.

See what the webpage looks like on a desktop computer: Tap Request Desktop Website (if available).

You can also adjust Safari settings in Accessibility settings. Go to Settings > Accessibility > Per-App Settings. Tap Add App, choose Safari, then tap Safari to adjust the settings.

Choose where to save downloads

When you download a file in Safari, you can choose whether to save it to iCloud or on your iPhone.

iCloud Drive: Select this option to save downloads to the Downloads folder in iCloud Drive. This allows you to access the downloaded file on any iPhone, iPad, or Mac where you’re signed in with the same Apple ID .

On My iPhone: Select this option to save downloads to the Downloads folder on your iPhone.

Share website passwords with a group

You can create a group of trusted contacts and share a set of passwords. Passwords stay up to date for everyone in the group, and you can remove someone at any time.

See Create shared password groups .

Adjust privacy settings for Safari

You can choose what privacy settings you want across Safari, and create individual exceptions for websites. See Browse privately .

📒 FREE FOCUS ASSESSMENT : All-New   →   Get Started!

Capture Your Ideas : Learn Ulysses   →   Brand New Course!

💌 NEW: Calm Inbox : Less Email, More Focus  →  Get Access

📒 NEW: 2023 Digital Planner : Made for iPad   →   Yes, Please!

FREE! Plan Your Ideal Week : Bonus Workshop + Planner   →   Get the Workshop

NEW! All the Things : Productivity Course   →   Check it Out

Productivity Workshop : The 4-Part Flywheel   →   GET ACCESS!

Bundle Up and Save : 25% discount on all app courses   →   Learn More

Simplify Your Time Management : New Course   →   Finally!

🧠 To Obsidian and Beyond : All-New Course   →   GET ACCESS

How to use Responsive Design Mode in Safari

Anyone that works with websites knows how important it is that they scale correctly on all types of devices. While mobile is extremely important, desktop is still a primary way that a lot of people experience the internet.

On the Mac, Safari makes it extremely easy to check websites across all types of devices and screen sizes. To do this, you need to enable the Developer menu. Click Safari → Preferences , and then click the Advanced tab. Enable the Show Develop menu in menu bar option in the Preferences dialog box.

One that is enabled, go to the Develop menu on the Safari menu bar. Click Enter Responsive Design Mode .

You’ll now see options for various iPhones, iPads, and desktop screen resolutions. This will allow you to make sure your websites look good for everyone , regardless of device choice.

We have more helpful tips right here .

Curated List of Must-Have Apps

We spend an inordinate amount of time sorting through hundreds of apps to find the very best. Our team here at The Sweet Setup put together a short list of our must-have, most-used apps in 2022.

You will get…

• The current list of The Sweet Setup’s top 8, must-have apps.
• A special, pro tip for each app to help you save time and become more of a power user.
• A hidden feature of each app that you may not have known about.

The Sweet Setup Staff Picks for 2022

These apps work on iPad, iPhone, and Mac. And they range across several different categories but are mostly focused on productivity. They will help you get the most out of your devices and your day.

• How to Use Copilot In Word
• Traveling? Get These Gadgets!

How to Activate and Use Responsive Design Mode in Safari

Access developer tools in Apple's web browser

What to Know

• To enable: Preferences > select Advanced tab > toggle Show Develop menu in menu bar on.
• To use: select Develop > Enter Responsive Design Mode in Safari toolbar.

This article explains how to enable Responsive Design Mode in Safari 9 through Safari 13, in OS X El Capitan through macOS Catalina.

How to Enable Responsive Design Mode in Safari

To enable the Safari Responsive Design Mode, along with other Safari developer tools:

Go to the Safari menu and select Preferences .

Press the keyboard shortcut Command + , (comma) to access Preferences quickly.

In the Preferences dialog box, select the Advanced tab.

At the bottom of the dialog box, select the Show Develop menu in menu bar check box.

You'll now see Develop in the top Safari menu bar.

Select Develop > Enter Responsive Design Mode in the Safari toolbar.

Press the keyboard shortcut Option + Command + R to enter Responsive Design Mode quickly.

The active web page displays in Responsive Design Mode. At the top of the page, choose an iOS device or a screen resolution to see how the page will render.

Alternatively, see how your web page will render in various platforms by using the drop-down menu above the resolution icons.

Safari Developer Tools

In addition to Responsive Design Mode, the Safari Develop menu offers other useful options.

Open Page With

Opens the active web page in any browser currently installed on the Mac.

When you change the User Agent, you can fool a website into thinking you're using another browser.

Show Web Inspector

Displays all a web page's resources, including CSS information and DOM metrics.

Show Error Console

Displays JavaScript , HTML, and XML errors and warnings.

Show Page Source

Lets you view the source code for the active web page and search the page contents.

Show Page Resources

Displays documents, scripts, CSS, and other resources from the current page.

Show Snippet Editor

Lets you edit and execute fragments of code. This feature is useful from a testing perspective.

Show Extension Builder

Helps you build Safari extensions by packaging your code accordingly and appending metadata.

Start Timeline Recording

Lets you record network requests, JavaScript execution, page rendering, and other events within the WebKit Inspector.

Empty Caches

Deletes all stored caches within Safari, not only the standard website cache files.

Disable Caches

With caching disabled, resources are downloaded from a website each time an access request is made as opposed to using the local cache.

Allow JavaScript from Smart Search Field

Disabled by default for security reasons, this feature allows you to enter URLs containing JavaScript into the Safari address bar.

Get the Latest Tech News Delivered Every Day

• Add More Features by Turning on Safari's Develop Menu
• How to Reset Safari to Default Settings
• How to Activate the iPhone Debug Console or Web Inspector
• How to View Internet Explorer Sites on a Mac
• How to Use Web Browser Developer Tools
• Speed Up Safari With These Tuneup Tips
• How to View HTML Source in Safari
• How to Change the Default Search Engine in Chrome for iOS
• What Is Safari?
• How to Enable Safari's Debug Menu to Gain Added Capabilities
• How to Manage Cookies in the Safari Browser
• How to Use Reading Mode on an iPhone or iPad
• How to Inspect an Element on a Mac
• How to Modify Text Size in the Safari Browser on a Mac
• Keyboard Shortcuts for Safari on macOS
• How to Disable JavaScript in Safari for iPhone

• Español – América Latina
• Português – Brasil
• Tiếng Việt
• More panels

Simulate mobile devices with device mode

Use device mode to approximate how your page looks and performs on a mobile device.

Device mode is the name for a collection of features in Chrome DevTools that help you simulate mobile devices. These features include:

• Simulating a mobile viewport
• Throttling the CPU
• Simulating geolocation
• Setting orientation

Limitations

Think of device mode as a first-order approximation of how your page looks and feels on a mobile device. With device mode you don't actually run your code on a mobile device. You simulate the mobile user experience from your laptop or desktop.

There are some aspects of mobile devices that DevTools will never be able to simulate. For example, the architecture of mobile CPUs is very different than the architecture of laptop or desktop CPUs. When in doubt, your best bet is to actually run your page on a mobile device. Use Remote Debugging to view, change, debug, and profile a page's code from your laptop or desktop while it actually runs on a mobile device.

Simulate a mobile viewport

Click devices Toggle device toolbar to open a toolbar that lets you simulate a mobile viewport.

By default, the device toolbar opens in viewport with Dimensions set to Responsive .

Responsive Viewport Mode

Drag the handles to resize the viewport to whatever dimensions you need. Or, enter specific values in the width and height boxes. In this example, the width is set to 480 and the height is set to 415 .

Alternatively, use the width presets bar to set the width with a click to one of the following:

Show media queries

DevTools now displays two additional bars above the viewport:

• The blue bar with max-width breakpoints.
• The orange bar with min-width breakpoints.

Click between breakpoints to change the viewport's width so that the breakpoint gets triggered.

To find the corresponding @media declaration, right-click between breakpoints and select Reveal in source code . DevTools opens the Sources panel at the corresponding line in the Editor .

Set device pixel ratio

Device pixel ratio (DPR) is the ratio between physical pixels on the hardware screen and logical (CSS) pixels. In other words, DPR tells Chrome how many screen pixels to use to draw a CSS pixel. Chrome uses the DPR value when drawing on HiDPI (High Dots Per Inch) displays.

To set a DPR value:

In the action bar at the top of the viewport, select a DPR value from the new DPR drop-down menu.

Set the device type

Use the Device Type list to simulate a mobile device or desktop device.

The next table describes the differences between the options. Rendering method refers to whether Chrome renders the page as a mobile or desktop viewport. Cursor icon refers to what type of cursor you see when you hover over the page. Events fired refers to whether the page fires touch or click events when you interact with the page.

Device-specific mode

To simulate the dimensions of a specific mobile device, select the device from the Dimensions list.

For more information, see Add a custom mobile device .

Rotate the viewport to landscape orientation

Click screen_rotation Rotate to rotate the viewport to landscape orientation.

See also Set orientation .

Toggle dual-screen mode

Some devices, for example, Surface Duo, have two screens and two ways to use them: with one or both screens active.

To toggle between dual and single screen, click the devices_fold Toggle dual-screen mode in the toolbar.

Set device posture

Some devices, for example, Asus Zenbook Fold, have foldable screens. Such screens have a posture: continuous or folded. The continuous posture refers to a "flat" position and folded forms an angle between sections of the display.

To set the device posture, select Continuous or Folded from the corresponding drop-down menu in the toolbar.

Show device frame

In this example, DevTools shows the frame for the Nest Hub.

Add a custom mobile device

To add a custom device:

Click the Device list and then select Edit .

On the Settings > Devices tab, either choose a device from the list of supported ones or click Add custom device to add your own.

If you're adding your own, enter a name, width, and height for the device, then click Add .

The device pixel ratio , user agent string , and device type fields are optional. The device type field is the list that is set to Mobile by default.

Back in the viewport, select the newly added device from the Dimensions list.

Show rulers

DevTools shows rulers at the top and to the left of the viewport.

Click the rulers at specific marks to set the viewport's width and height.

Zoom the viewport

Use the Zoom list to zoom in or out.

Capture a screenshot

To capture a screenshot of the whole page including the content that isn't visible in the viewport, select Capture a full size screenshot from the same menu.

Throttle the network and CPU

To throttle both the network and CPU, select Mid-tier mobile or Low-end mobile from the Throttle list.

Mid-tier mobile simulates fast 3G and throttles your CPU so that it is 4 times slower than normal. Low-end mobile simulates slow 3G and throttles your CPU 6 times slower than normal. Keep in mind that the throttling is relative to the normal capability of your laptop or desktop.

Note that the Throttle list will be hidden if your Device toolbar is narrow.

Throttle the CPU only

Throttle the network only

To throttle the network only and not the CPU, go the Network panel and select Fast 3G or Slow 3G from the Throttle list.

Or press Command+Shift+P (Mac) or Control+Shift+P (Windows, Linux, ChromeOS) to open the Command Menu, type 3G , and select Enable fast 3G throttling or Enable slow 3G throttling .

Emulate sensors

Use the Sensors tab to override geolocation, simulate device orientation, force touch, and emulate idle state.

The next sections provide a quick look on how to override geolocation and set device orientation. For a complete list of features, see Emulate device sensors .

Override geolocation

Or press Command+Shift+P (Mac) or Control+Shift+P (Windows, Linux, ChromeOS) to open the Command Menu, type Sensors , and then select Show Sensors .

Select one of the presets from the Location list, or select Other... to enter your own coordinates, or select Location unavailable to test out how your page behaves when geolocation is in an error state.

Set orientation

Select one of the presets from the Orientation list or select Custom orientation to set your own alpha, beta, and gamma values.

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License , and code samples are licensed under the Apache 2.0 License . For details, see the Google Developers Site Policies . Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2024-02-20 UTC.

The Ultimate Guide to Customizing Safari on Mac

Make Safari an even better browser for your Mac by customizing it. Here's how to tweak it to your liking.

Safari can be a pleasure to use if you take the time to customize it and get rid of any potential annoyances. You don't need to spend a lot of time on this task.

As you'll see below, even a few simple tweaks can go a long way in polishing up Apple's native browser.

1. Tweak Tab and Window Behavior

Start by setting up Safari to restore windows from the previous session every time you open the app. To do this, under Safari > Preferences > General , select All windows from last session from the Safari opens with dropdown menu.

This tweak makes the homepage seem redundant, because it changes what you see when you first open Safari. Despite that, it's a good idea to set the homepage to your most-loved web page to keep it accessible with a click of the Home button on the toolbar.

From the same settings section, you can also choose what shows up in every new window and tab by default. A blank page, your homepage, and your most frequently opened pages are a few of your options here.

2. Clean Up the Toolbar

While Safari's toolbar is minimal to begin with, it gets cluttered up fast when you install extensions. That's because each extension automatically enables its own toolbar button.

Also, you'll find that you have no need for certain toolbar buttons. For example, if you know the shortcut for displaying the sidebar ( Cmd + Shift + L ), you don't need the corresponding button.

In any case, if you don't want to get distracted by the sight of unnecesary toolbar buttons, it's important to clean up the toolbar once in a while. To do that, first right-click on a blank space in the toolbar and then click on the Customize Toolbar option that appears.

From the toolbar button choices that show up in a box, drag the ones you need to the toolbar and the ones you don't off the toolbar. You can also rearrange buttons by dragging and dropping them into place. Click on the Done button once you're satisfied with the results.

(Pay attention to the default set of buttons at the bottom of the toolbar box. You can restore this set any time if you ever make a giant mess of your toolbar setup.)

If you simply want to rearrange or get rid of toolbar buttons, you can do that even without opening the Customize Toolbar box. Hold down the Cmd key and move the buttons around or drag them off the toolbar as needed.

3. Set Up Bookmarks and the Reading List

Your Safari customization is incomplete without easy access to your favorite web pages. If you want to import your bookmarks from Chrome, Firefox, or an HTML file, you can do so via File > Import From . You can also create bookmarks from active tabs with the Bookmarks > Add Bookmark menu option or with the shortcut Cmd + D .

Read our guide to bookmarks and favorites in Safari to learn everything you need to know about managing your bookmarks.

Apart from bookmarks, Safari has another useful read-it-later feature called Reading List. It's ideal for temporary bookmarks, reading articles offline, and sharing them between your Apple devices.

To add a page to your Reading List, click on the tiny plus button that appears next to the URL in the address bar when you hover over it. Clicking on Bookmarks > Add to Reading List when you have the page open also works.

Your Reading List content shows up in the second tab in Safari's sidebar. You can access the list directly by clicking on View > Show Reading List Sidebar .

Want Safari to save your Reading List articles for offline use automatically? To make this happen, visit Safari > Preferences > Advanced and select the checkbox next to Reading List .

4. Customize Websites

Safari lets you configure a few settings on a per-website basis. These include camera and microphone access, push notifications, and auto-play settings. To tweak these, visit Safari > Preferences > Websites .

In the sidebar, you'll see the list of settings you can configure for individual websites. For each setting, notice the default behavior listed below the right-hand pane. You can leave that setting alone or pick a different option from the dropdown menu provided.

Above this setting, you'll see a list of currently open websites and can configure a specific setting for each of them. For example, in the Auto-Play pane, notice that the default Safari behavior is to stop auto-playing media.

Now, let's say you have YouTube open in the background. You can then program Safari to auto-play all content on YouTube in future. To do this, select the Allow All Auto-Play option from the dropdown menu next to YouTube in the list of active websites.

Related: Safari Can't Open the Page? Here's What to Do

5. Create Custom Keyboard Shortcuts for Bookmarks

Did you know that you can set up shortcuts for your Safari bookmarks? It's one of those tiny but useful macOS features you'll definitely want to know about.

To create shortcuts for a bookmark, first visit System Preferences > Keyboard > Shortcuts > App Shortcuts . Now, click on the plus button below the right-hand pane to reveal the shortcut creation popup. Here, select Safari from the Application dropdown menu.

Next, switch to Safari and note the name of the bookmark you want to create the shortcut for, exactly as it appears under Bookmarks > Favorites . Type that name in the Menu Title field back in the macOS settings app you switched from.

(You can also copy the bookmark name from the Bookmarks Editor and paste it into the Menu Title field.)

Now, highlight the field next to Keyboard Shortcut and hit the key combination you want to use for the bookmark in question. Click on the Add button to wrap up.

The shortcut you set up should start working immediately in Safari, as long as the address bar isn't selected. Test it out and then set up shortcuts for the rest of your most-important websites.

Be sure to also check out our Safari shortcuts cheat sheet .

6. Add More Features With Extensions

Safari's extension gallery hasn't ever been as vast as that of Chrome and Firefox. It's a pity that now it has shrunk further thanks to Apple's decision to kill support for non-App Store extensions.

Despite that, you still have quite a few useful extensions to choose from. Here are a few of those we consider must-haves:

• AutoPagerize : This auto-loads paginated webpages.
• Shut Up : Will auto-hide comments on webpages.
• Awesome Screenshot : Capture and annotate screenshots.

7. Enable Special Features With the Develop Menu

You'll notice that you can't inspect web pages in Safari to debug and tweak page content. That's because this advanced feature is available only via a hidden menu.

To reveal this---the Develop menu---first visit Safari > Preferences > Advanced . There, at the bottom of the pane, select the checkbox for Show Develop menu in the menu bar .

You'll then see the menu show up between the Bookmarks and Window menus. It lets you empty caches, tweak webpages on the fly, disable images, and so on.

With the Develop menu enabled, an Inspect Element option shows up in the right-click menu. Click on this item to reveal Safari's Web Inspector for the active page.

Make Safari Your Most Favorite Browser Yet

Safari is one of the best default Mac apps you don't need to replace . We consider it the optimal browser for Mac (and iOS) users . And we guarantee that with changes like the ones we discussed above, Safari will be a delight to use every day.

Blazing fast. Incredibly private.

Safari is the best way to experience the internet on all your Apple devices. It brings robust customization options, powerful privacy protections, and optimizes battery life — so you can browse how you like, when you like. And when it comes to speed, it’s the world’s fastest browser. 1

Performance

More with the battery. less with the loading..

With a blazing-fast JavaScript engine, Safari is the world’s fastest browser. 1 It’s developed to run specifically on Apple devices, so it’s geared to make the most out of your battery life and deliver long-lasting power.

Increased performance

We’re always working to make the fastest desktop browser on the planet even faster.

Improved power efficiency

Safari lets you do more online on a single charge.

Up to 4 hours more streaming videos compared with Chrome 3

Up to 17 hours of video streaming 3

Best-in-class browsing

Safari outperforms both Mac and PC browsers in benchmark after benchmark on the same Mac. 4

• JetStream /
• MotionMark /
• Speedometer /

JavaScript performance on advanced web applications. 4

Safari vs. other Mac browsers

Safari on macOS

Chrome on macOS

Edge on macOS

Firefox on macOS

Safari vs. Windows 11 browsers

Chrome on Windows 11

Edge on Windows 11

Firefox on Windows 11

Rendering performance of animated content. 4

Web application responsiveness. 4

4K video streaming

See your favorite shows and films in their best light. Safari supports in-browser 4K HDR video playback for YouTube, Netflix, and Apple TV+. 5 And it runs efficiently for longer-lasting battery life.

Privacy is built in.

Online privacy isn’t just something you should hope for — it’s something you should expect. That’s why Safari comes with industry-leading privacy protection technology built in, including Intelligent Tracking Prevention that identifies trackers and helps prevent them from profiling or following you across the web. Upgrading to iCloud+ gives you even more privacy protections, including the ability to sign up for websites and services without having to share your personal email address.

Intelligent Tracking Prevention

Safari stops trackers in their tracks.

What you browse is no one’s business but your own. Safari has built‑in protections to help stop websites and data-collection companies from watching and profiling you based on your browsing activity. Intelligent Tracking Prevention uses on‑device intelligence to help prevent cross‑site tracking and stops known trackers from using your IP address — making it incredibly difficult to learn who you are and what you’re interested in.

Privacy Report

Safari makes it simple to see how your privacy is protected on all the websites you visit. Click Privacy Report in the Safari menu for a snapshot of cross-site trackers currently prevented from profiling you on the website you’re visiting. Or view a weekly Privacy Report to see how Safari protects you as you browse over time.

Customization

Putting the you in url..

Safari is more customizable than ever. Organize your tabs into Tab Groups so it’s easy to go from one interest to the next. Set a custom background image and fine-tune your browser window with your favorite features — like Reading List, Favorites, iCloud Tabs, and Siri Suggestions. And third-party extensions for iPhone, iPad, and Mac let you do even more with Safari, so you can browse the way you want across all your devices.

Safari Profiles allow you to separate your history, extensions, Tab Groups, favorites, cookies, and more. Quickly switch between profiles for topics you create, like Personal and Work.

Web apps let you save your favorite websites to the Dock on Mac and to the Home Screen on iPhone and iPad. A simplified toolbar and separate settings give you an app-like experience.

Safari Extensions add functionality to your browser to help you explore the web the way you want. Find and add your favorite extensions in the dedicated Safari category on the App Store.

Save and organize your tabs in the way that works best for you. Name your Tab Groups, edit them, and switch among them across devices. You can also share Tab Groups — making planning your next family trip or group project easier and more collaborative.

Smart Tools

Designed to help your work flow..

Built-in tools create a browsing experience that’s far more immersive, intuitive, and immediate. Get detailed information about a subject in a photo with just a click, select text within any image, instantly translate an entire web page, and quickly take notes wherever you are on a site — without having to switch apps.

Notes is your go-to app to capture any thought. And with the Quick Note feature, you can instantly jot down ideas as you browse websites without having to leave Safari.

Translation

Translate entire web pages with a single click. You can also get translations for text in images and paused video without leaving Safari.

Interact with text in any image or paused video on the web using functions like copy and paste, translate, and lookup. 6

Visual Look Up

Quickly learn more about landmarks, works of art, breeds of dogs, and more with only a photo or an image you find online. And easily lift the subject of an image from Safari, remove its background, and paste it into Messages, Notes, or other apps.

Surf safe and sound.

Strong security protections in Safari help keep you safe. Passkeys introduce a safer way to sign in. iCloud Keychain securely stores and autofills passkeys and passwords across all your devices. Safari also notifies you when it encounters suspicious websites and prevents them from loading. Because it loads each web page in a separate process, any harmful code is always confined to a single browser tab so it won’t crash the entire application or access your data. And Safari automatically upgrades sites from HTTP to the more secure HTTPS when available.

Passkeys introduce a more secure and easier way to sign in. No passwords required.

Passkeys are end-to-end encrypted and safe from phishing and data leaks, and they are stronger than all common two-factor authentication types. Thanks to iCloud Keychain, they work across all your Apple devices, and they even work on non-Apple devices.

Learn more about passkeys

Apple Pay and Wallet make checkout as easy as lifting a finger.

Apple Pay is the easiest and most secure way to shop on Safari — allowing you to complete transactions with Face ID or Touch ID on your iPhone or iPad, with Touch ID on your MacBook Pro or MacBook Air, or by double-clicking the side button on your Apple Watch.

Learn more about Apple Pay

With AutoFill, you can easily fill in your previously saved credit card information from the Wallet app during checkout. Your credit card details are never shared, and your transactions are protected with industry-leading security.

Same Safari. Different device.

Safari works seamlessly and syncs your passwords, bookmarks, history, tabs, and more across Mac, iPad, iPhone, and Apple Watch. And when your Mac, iOS, or iPadOS devices are near each other, they can automatically pass what you’re doing in Safari from one device to another using Handoff. You can even copy images, video, or text from Safari on your iPhone or iPad, then paste into another app on your nearby Mac — or vice versa.

When you use Safari on multiple devices, your tabs carry over from one Apple device to another. So you can search, shop, work, or browse on your iPhone, then switch to your iPad or Mac and pick up right where you left off.

Save web pages you want to read later by adding them to your Reading List. Then view them on any of your iCloud-connected devices — even if you’re not connected to the internet.

iCloud Keychain securely stores your user names, passkeys, passwords, and credit card numbers and keeps them up to date on your trusted devices. So you can easily sign in to your favorite websites — as well as apps on iOS and iPadOS — and quickly make online purchases.

Designed for developers.

Deep WebKit integration between Mac hardware and macOS allows Safari to deliver the fastest performance and the longest battery life of any browser on the platform, while supporting modern web standards for rich experiences in the browser. WebKit in macOS Sonoma includes optimizations that enable even richer browsing experiences, and give developers more control over styling and layout — allowing for more engaging content.

Make Safari your default browser

Customize your start page, view your browsing privacy report, monitor your saved passwords, use apple pay in safari, view your tabs across all your devices, read the safari user guide, get safari support.

We explain and teach technology, solve tech problems and help you make gadget buying decisions.

Top 6 Ways to Customize Safari on Mac

Parth Shah is an evergreen freelance writer covering how-tos, app guides, comparisons, listicles, and troubleshooting guides on Android, iOS, Windows, Mac, and smart TV platforms. He has over five years of experience and has covered 1,500+ articles on GuidingTech and Android Police. In his free time, you will see him binge-watching Netflix shows, reading books, and traveling.

With macOS Big Sur and Monterey, Apple positions Safari as the true alternative to Google Chrome or Microsoft Edge . With each iteration of macOS, Apple adds a good amount of new features and customization options to Safari on Mac. Here are the top six ways to customize Safari like a pro on Mac.

Not everyone is a fan of Safari’s new tab management, boring white background, or a simple home screen. With Safari’s personalization options, you can easily tune the Safari experience to your liking. Follow the methods below and make necessary changes to the Safari browser to make it truly yours.

1. Try New Tab Design

With macOS Monterey, Apple is offering a different way to organize your tabs. You can either keep your tabs separate (the default option) or use the compact layout.

Step 1: Open Safari on Mac and click on Safari name in the menu bar.

Step 2: Go to Safari Preferences.

Step 3: From the Tabs menu, select Compact.

You will quickly see the current tabs changing the position to the top with extensions and other items. This is useful for those who want to utilize more space in Safari on Mac.

As for us, we find it quite a busy arrangement when dealing with dozens of tabs, so we moved back to the Separate option.

2. Enable Color in Tab Bar

This is yet another addition Apple added with the macOS Monterey update. You can now enable color in the tab bar. Safari will extract color from the website and show it across the tab bar.

Step 1: Open the Safari Preferences menu.

Step 2: Go to Tabs.

Step 3: Enable Show color in tab bar option.

Again, when you have multiple tabs opened in Safari and are switching among them, you might have a hard time constantly changing colors in Safari tabs. From the same menu, you can revert to the previous method.

3. Customize Toolbar

This is one of the oldest methods to customize the Safari experience on Mac. Open Safari and right-click on a space in the top space. Select Customize Toolbar, and it will open a dedicated toolbar menu.

You can use the toolbar menu to drag and drop relevant functions to the toolbar. Users can even add Flexible space to the Safari toolbar.

We mostly keep the extensions from the left side of the address bar and the Download, Share and Add Tab on the right side.

4. Apply Background Wallpaper

Introduced with macOS Big Sur, Apple allows you to change the default background in the Safari start page. Follow the steps below to change wallpaper in Safari on Mac.

Step 1: Open Safari and click on the hamburger menu at the bottom.

Step 2: Use the scroll bar at the bottom and glance over the default wallpapers to apply in Safari.

Step 3: If you are not satisfied with Apple’s built-in wallpapers, you can click on the + icon and apply a wallpaper from the Mac storage.

Make sure you don’t end up using a funky wallpaper that makes it difficult for you to read text on the Safari home page.

5. Enable iCloud Tabs

This is useful for those switching between Apple devices frequently. If you have Safari tabs opened on iPhone or iPad, you can easily access them from the Safari home page on Mac without going into the History.

Step 1: Go to Safari and click on the hamburger menu at the bottom.

Step 2: Enable iCloud tabs, and you will see the Safari tabs appearing on the home.

From the same menu, you can enable Privacy Report as well. Privacy report states the amount of harmful trackers Safari is blocking during your browsing sessions.

6. Change Search Engine

By default, Safari uses Google to answer your queries. However, Safari isn’t limited to Google only. You can easily change it to Yahoo or DuckDuckGo from the Preferences menu. Here’s how.

Step 1: Open Safari on Mac.

Step 2: Use command + , keys and open the preferences menu.

Step 3: Go to Search.

Step 4: Select the Search engine.

Step 5: You can change from Google to Yahoo, Bing, DuckDuckGo, or Ecosia.

If you are not satisfied with the new search engine, you can always go back to Google from the same menu.

Personalize Safari Experience on Mac

Users can also go ahead and uninstall Safari extensions on Mac. Safari remains our top choice to browse the web on the Mac. If you miss your favorite Chromium extensions, you can consider checking out Chrome or Edge on the Mac . We recommend going with Safari and making relevant changes based on your preferences for the rest of the crowd.

Was this helpful?

Last updated on 07 February, 2022

The above article may contain affiliate links which help support Guiding Tech. However, it does not affect our editorial integrity. The content remains unbiased and authentic.

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

The article above may contain affiliate links which help support Guiding Tech. The content remains unbiased and authentic and will never affect our editorial integrity.

DID YOU KNOW

More in Mac

Top 7 Ways to Fix Reminders Not Syncing Between iPhone and Mac

How To Fix Automator Folder Actions Not Working

Join the newsletter.

Get Guiding Tech articles delivered to your inbox.

How to Get the Toolbar Back on Safari

With Yosemite, Apple ships a minimalist-looking version of Safari that doesn't display its familiar navigation bars. When there's no place to enter a Web URL or search term at the top of Safari, the Toolbar is hidden from view. Two clicks return the Toolbar to its rightful — and familiar — place.

Advertisement

Video of the Day

Bring Back the Safari Toolbar

Go to the Safari View menu and select Show Toolbar . That's it! If you started with a minimalist window, you'll now see a URL address bar at the top of the screen.

Restoring All the Familiar Safari Navigation Bars

Return to the View menu and click on Show Favorites Bar , Show Sidebar , Show Tab Bar and Show Status Bar . Note that Show Toolbar has changed to Hide Toolbar; you can show or hide any of these features to customize Safari's appearance.

Underneath the Toolbar, the Favorites Bar contains text links to your favorites. Below that, the Tabs Bar shows websites opened in tabs. At the bottom left, the Status Bar displays what will happen if you click on a link or other active area of the website you're viewing.

• OS X Yosemite: Get to know the new, slimmed-down Safari

Report an Issue

Screenshot loading...

How to Simulate Mobile Devices with Device Mode in Chrome

Share this article

Developer Tools

Touch-enabled emulation, the mobile emulator device toolbar, css media query bars, emulated device options, bandwidth throttling simulation, emulated mobile sensors, remote real device debugging.

• Great! I Don’t Need Any Devices Now!

FAQs About Chrome Mobile Emulator

Website testing has become increasingly complex. The days of checking functionality in a couple of browsers are long gone. Your latest masterpiece must be rigorously evaluated on a range of mobile, tablet and desktop devices with differing OSs, screen resolutions, and capabilities. In extreme cases, it could take as long as the original development.

The process is complicated further by touch screens, hybrid devices, and high-density displays. If you’re coding on a regular PC with a mouse and keyboard, it’s difficult to appreciate how your interface will operate. Features such as mouse hover won’t necessarily work and your application could be inoperable. But how can you test your code on a range of operating systems during development and avoid the pain of managing and switching between multiple devices?

Fortunately, all modern browsers offer mobile emulation tools, and one of the best can be found in the Chrome browser. It can help identify early problems without leaving the comfort of your PC and development environment.

Start Chrome, navigate to the web page you want to test and open the Developer Tools (Menu > Tools > Developer Tools, Cmd + Opt + I on macOS or F12 / Ctrl + Shift + I on Windows and Linux).

You can now enable the browser emulator by clicking the Toggle device toolbar icon in the top left:

A device simulation will now appear:

While not quite an iOS or Android emulator, a number of mobile devices running both platforms can be selected as presets. The dimensions of the emulated screen can be changed when Responsive is selected as the device type.

Move your mouse over the device to see a circular “touch” cursor. This will react to touch-based JavaScript events such as touchstart , touchmove and touchend . Mouse-specific events and CSS effects should not occur.

Hold down Shift then click and move your mouse to emulate pinch zooming.

It’s worth spending a little time familiarizing yourself with the toolbar and menu above the Chrome emulator:

The default controls are:

• the device type (or Responsive )
• the current resolution
• the scale (the screen can be zoomed in or out to fit better in the emulator pane)
• the network speed
• a portrait/landscape toggle button

The three-dot menu allows you to show or hide additional controls:

• the device frame (if available, a graphic of the phone or tablet)
• CSS media query bars (see below )
• a pixel ruler
• add device pixel ratios
• add device types
• capture a screenshot (including the device frame if shown)
• capture a full-page screen shot

Select Show media queries from the three-dot menu to view a graphical color-coded representation of all media queries set in the CSS.

• BLUE: queries which target a maximum width
• GREEN: queries which target widths within a range
• ORANGE: queries which target a minimum width

Any bar can be clicked to set the emulator screen to that width.

The drop-down menu on the left allows you to select a device. Several dozen presets are provided for popular smart phones and tablets, including iPhones, iPads, Kindles, Nexus tablets, Samsung Galaxy, and so on.

Not all devices are presented at once. Click Edit… at the bottom of the device drop-down or click the DevTools Settings cog icon and choose the Devices tab:

You can enable or disable devices or enter your own by defining:

• a classification such as “Mobile” or “Tablet”
• a browser user agent string
• the device resolution
• and pixel ratio (such as 2 for iPhone Retina screens where the pixel density is twice as high as the reported viewport resolution)

All browsers identify themselves with a user agent string sent on every HTTP header. This can be examined on the client or server-side and, during the dark days of web development, would be used to modify or provide a different user experience. In extreme cases, the viewer would be directed to a different site. The technique was always flawed but has become largely redundant owing to Responsive Web Design techniques, and it was unsustainable given the number of devices available on the market.

The throttling drop-down allows you to emulate slow network speeds typically experienced on mobile connections or dodgy hotel and airport Wi-Fi! You can use this to ensure your site or application loads quickly and remains responsive in all environments.

The throttling drop-down is available in the Network tab and Chrome’s device toolbar. You can set your own bandwidth configuration by clicking the DevTools Settings cog icon and choosing the Throttling tab:

Click Add custom profile then enter:

• the profile name
• the download speed in kilobits per second
• the upload speed in kilobits per second
• the latency in milliseconds (the typical delay when making a network request)

Smartphones and tablets often have sensors such as GPS, gyroscopes, and accelerometers, which aren’t normally present in desktop devices. These can be emulated in Chrome by choosing More tools , then Sensors from the Developer Tools main three-dot menu:

A new pane appears which allows you to define:

• The current latitude and longitude or select a major city from the drop-down. You can also select Location unavailable to emulate how your application reacts when the device cannot obtain a reliable GPS signal.
• The orientation. Several presets are available or you can move the device image by clicking and dragging.
• The touch response.
• An idle state to examine how an app reacts to a lock screen.

Finally, Google Chrome allows you to connect a real Android device via USB for remote device debugging. Enter in the address bar, ensure Discover USB devices is checked, then attach your phone or tablet and follow the instructions.

Chrome allows you to set up port forwarding so you can navigate to a web address on your local server on the device. Chrome’s preview pane shows a synchronized view of the device screen and you can interact either using the device or Chrome itself.

The full range of developer tools can be used including the Application tab to test Progressive Web Apps in offline mode. Note that, unlike a real application which requires HTTPS, Chrome permits PWAs to run from localhost over an HTTP connection.

Great! I Don’t Need Any Devices Now!

Chrome’s mobile browser emulator is useful and powerful, but it’s no substitute for interacting with your website or app on a real device to evaluate the full user experience.

You should also be aware that no device emulator is perfect. For example, Chrome shows a representation of the page on an iPhone or iPad but will not attempt to simulate the standards support or Safari quirks.

That said, for quick and dirty mobile testing, Chrome’s device emulation is excellent. It’s far easier than switching between real smart phones, and you’ll have all the developer tools at your disposal. It saves hours of effort.

What is Chrome Mobile Emulator?

Chrome Mobile Emulator is a feature provided by the Google Chrome web browser that allows users to simulate the experience of browsing the web on a mobile device directly from their desktop or laptop computer. This emulator is a part of the Chrome Developer Tools, a set of built-in tools designed to assist web developers in testing and optimizing their websites and web applications. With the Chrome Mobile Emulator, developers can select from a range of predefined mobile device profiles, such as various Android and iOS devices, and view their websites as they would appear on those specific devices. It allows developers to test responsiveness, ensuring that their websites or web apps adapt and display correctly on a variety of mobile devices. Chrome Mobile Emulator serves as a valuable tool for web developers, helping them ensure that their websites and web applications are mobile-friendly and provide a seamless user experience across a wide range of mobile devices. It accomplishes this by offering a comprehensive set of emulation features within the Chrome Developer Tools, making it easier to develop and optimize mobile web content without the need for physical access to multiple devices.

How to simulate a mobile device on Chrome?

To simulate a mobile device on the Google Chrome web browser, you can use the built-in developer tools. Here’s how to do it: Open Developer Tools: There are several ways to open Chrome’s Developer Tools. You can press F12 or Ctrl+Shift+I ( Cmd+Option+I on Mac) on your keyboard. Alternatively, right-click on a web page element and select “Inspect” from the context menu. You can also go to the Chrome menu (three dots in the top-right corner) > More Tools > Developer Tools . Toggle Device Toolbar: In the Developer Tools panel, you’ll find various tabs at the top. Look for the “Toggle Device Toolbar” icon, which is usually represented by a small device icon. It’s commonly located in the top-left corner of the Developer Tools panel. You can also activate it by pressing Ctrl+Shift+M ( Cmd+Option+M on Mac) on your keyboard. Choose a Device: Click on the “Toggle Device Toolbar” icon, and you’ll see a toolbar appear at the top of the web page. This toolbar allows you to select a specific device or device type from the dropdown menu. You can choose from various Android or iOS devices. Additionally, you can toggle the device orientation between portrait and landscape and adjust the viewport dimensions by clicking on the dimensions display. You can select from available presets or enter custom dimensions. Reload the Page: After selecting the desired device and orientation, you can simply refresh the web page you’re viewing. Chrome will then render the page as if it were displayed on the selected mobile device. You can interact with the page and test its responsiveness just as you would on a real mobile device. Access Additional Features: Within the Device Toolbar, you can use the “Network Conditions” tab to simulate different network speeds and conditions. This helps you evaluate how your website or web application performs under various network conditions. Additionally, the “Sensors” tab allows you to simulate various sensor inputs, such as geolocation.

Why is Chrome Mobile Emulator not accurate?

Chrome Mobile Emulator may not provide perfect accuracy in simulating the user experience on real mobile devices for several reasons. It primarily emulates the behavior of the Chrome browser, which may differ from other browsers used on mobile devices. Additionally, emulators cannot fully replicate hardware capabilities, varying operating systems, network complexities, and device-specific behaviors. Interaction methods, such as touch events, might not precisely mimic real devices. Moreover, emulators may not always keep up with the latest updates and changes in browsers and devices. While valuable for initial testing, using actual mobile devices for testing remains crucial to ensure a more accurate assessment of website or app performance across diverse platforms.

Can Chrome emulate Android?

Yes, Chrome Mobile Emulator is a feature provided by Chrome that allows users to simulate the experience of browsing the web on a mobile device directly from their desktop or laptop computer.

Craig is a freelance UK web consultant who built his first page for IE2.0 in 1995. Since that time he's been advocating standards, accessibility, and best-practice HTML5 techniques. He's created enterprise specifications, websites and online applications for companies and organisations including the UK Parliament, the European Parliament, the Department of Energy & Climate Change, Microsoft, and more. He's written more than 1,000 articles for SitePoint and you can find him @craigbuckler .

Book a wildlife encounter at Aggieland Wild Animal Safari

BRYAN, Texas (KBTX) - This segment on The Three was paid for and sponsored by Aggieland Wild Animal Safari.

Most commonly known for their Drive-Thru Safari, Aggieland Wild Animal Safari also offers up close and personal animal encounters that educate, engage and create memorable moments between people and animals.

Besides inspiring participants to take a lifelong interest in conservation and the natural world, these encounters are also just plain fun!

Guests can choose from a variety of encounters.

You can spend some time in the rainforest with Southern Tamanduas, Pinky and The Brain!

This encounter includes 20 minutes of guided personal interaction, feeding (they love honey!), and enrichment activities inside their enclosure.

Another option is to meet some scaly, smooth, or hard-shelled critters!

Participants will assist reptile keepers in their daily duties, take a tour of the Off-Exhibit Reptile Hallway, and interact with various species.

You can also get up close with the world’s tallest mammal!

With this encounter, you will get to meet and feed the giraffes (they love their lettuce!). During the feeding, one of the animal keepers will teach you about the giraffe’s behavior, habitat, and Aggieland Safari’s conservation efforts.

Your final choice of encounter is a meet-and-greet with the world’s largest rodent (they act just like dogs!). Meet a family of capybaras and see for yourself just how cute they really are!

All Animal Encounters must be booked at least 24 hours in advance and be no more than 6 people per group.

Click here to book now or call (979) 599-5440.

Copyright 2024 KBTX. All rights reserved.

Several staff members cut from A&M athletic department

College Station ISD addresses layoff rumors in email to parents

College Station police say 1 person detained following narcotics search warrant execution in Bryan

Texas A&M student saves a patient’s life at St. Joseph Health College Station Hospital

Prepare to see more progress on projects along South College Avenue

Latest news.

Walk through the free University Art Galleries and see what’s on display!

THE THR3E(Recurring) EXTENDED - Aggieland Safari Animal Encounter

THE THR3E(Recurring) EXTENDED - Arts Council Bush Library

National Volunteer Month: Help Habitat For Humanity build homes for deserving families

university galleries