Custom Tabs are a feature in Android browsers that gives app developers
a way to add a customized browser experience directly within their app.
Loading web content has been a part of mobile apps since the early days of
smartphones, but older options can present challenges for developers. Launching
the actual browser is a heavy context switch for users that isn't customizable,
while WebViews
don't support
all features of the web platform, don't share
state with the browser and add maintenance overhead.
Custom Tabs offer a better user experience than opening an external
browser. They allow users to remain within the app while browsing, increasing
engagement and reducing the risk of users abandoning the app. They accomplish
this by being powered directly by the user's preferred browser, and automatically
sharing the state and features offered by it. You don't need to write custom
code to manage requests, permission grants, or cookie stores.
What can Custom Tabs do?
By using a Custom Tab, your web content will load in whatever rendering engine
powers your user's preferred browser. Any API or web platform feature is
available there, and will be available in your Custom Tab. Their browsing session,
saved passwords, payment methods, and addresses will all show up just like they
are accustomed to already.
What can I customize in a Custom Tab?
Quite a bit! Custom Tabs give you fine grained control over a lot of the browser
chrome and user experience. Within your app, you launch a Custom Tab using an
Intent
. When this Intent is called, you can add a number of attributes to
the
CustomTabIntent
to get the exact experience you want. Some
customizations that you can add are listed here.
Custom entrance and exit animations to match the rest of your app
Modifing the toolbar color to match your app's branding.
Color consistency that can stay with your app, even if they switch between light and dark themes.
Custom actions and entries to the browser's toolbar, and menus.
Control the launch height of the Custom Tab, enabling things like streaming your
videos while interacting with your web store.
Users can minimize a Custom Tab to interact with the underlying app and restore it at any time without losing any progress to resume their journey. This gives users an alternative to closing the Custom Tab and they can seamlessly multi-task between the web and the native app. The feature is enabled by default for Custom Tabs starting with Chrome 122 Beta.
That is far from everything. Custom Tabs are very powerful, and under active
development. Each browser needs to add support for these features as they become
available. While nearly all have some level of support, it is important to know
what may or may not be available in your user's browsers. Refer to the
feature comparison table
to quickly
check the availability of the different features across popular Android
browsers.
You can test this now with our
sample
on GitHub.
When should I use Custom Tabs?
There is no single "correct" way to load web content. In certain situations,
WebView is going to be the right technology to use. For example, if you are
exclusively hosting your own content inside your app, or if you need to inject
javascript directly from your app. If your app directs people to URLs outside
domains, the built-in shared state in Custom Tabs means they are likely a
better choice. Other strengths of Custom Tabs include:
- Security: Custom Tabs use Google's Safe Browsing to protect the user and the
device from dangerous sites.
- Performance optimization:
- Pre-warming of the Browser in the background, while avoiding stealing
resources from the application.
- Speed up the page load time by speculatively loading URLs in advance.
- Lifecycle management: Apps launching a Custom Tab won't be evicted by the
system during the Tabs use - its importance is raised to the "foreground" level.
- Shared cookie jar and permissions model so users don't have to sign-in to sites
they are already connected to, or re-grant permissions they have already
granted.
- Browser features like Data Saver are shared, if enabled - loading content faster and cheaper.
- Synchronized AutoComplete across devices for better form completion.
- Users can return to app with an integrated back button.
Custom Tabs versus Trusted Web Activity
Trusted Web Activities
extend the Custom Tabs protocol and shares most of
its benefits. But, instead of providing a customized UI, it allows developers to
open a browser tab without any UI at all. It is recommended for developers who
want to open their own
Progressive Web App
, in full screen, inside their
own Android app.
Where are Custom Tabs available?
Custom Tabs is a feature supported by browsers on the Android platform. It was originally
introduced by
Chrome
, on version 45. The protocol is supported by most Android
browsers.
We're looking for feedback, questions and suggestions on this project, so we
encourage you to file issues on
crbug.com
and ask questions on Twitter
@ChromiumDev
.
Get started
In addition to the
GitHub Demo
, there are a number of guides to get you
started with Custom Tabs.
For questions, check the
chrome-custom-tabs
tag on StackOverflow.