diff --git a/.gitattributes b/.gitattributes
index 32468bef9d39..7f041feced97 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -3,6 +3,7 @@ WORKSPACE diff=python
**/*.bazel diff=python
**/*.bzl diff=python
**/*.cps diff=json
+**/site.webmanifest diff=json
# These lines tell git diff viewers to ignore data objects.
# Wavefront geometry definition
diff --git a/doc/BUILD.bazel b/doc/BUILD.bazel
index f6c0a4a8fd07..3153999e4484 100644
--- a/doc/BUILD.bazel
+++ b/doc/BUILD.bazel
@@ -37,13 +37,45 @@ drake_py_library(
deps = ["@rules_python//python/runfiles"],
)
+# For maximum browser compatibility these should be at the root of the
+# generated website and should not be renamed.
+filegroup(
+ name = "favicon",
+ srcs = [
+ # Manual resizing and padding of "assets/drake-dragon.png" to
+ # 192x192px.
+ "android-chrome.png",
+ # Manual resizing and padding of "assets/drake-dragon.png" to
+ # 180x180px.
+ "apple-touch-icon.png",
+ # Minimal configuration for Microsoft browsers. Versions of Edge prior
+ # to the change to WebKit always request a file named
+ # "browserconfig.xml" whether or not an alternative is specified in the
+ # HTML.
+ "browserconfig.xml",
+ # Apple Safari always requests a file named "favicon.ico" whether or
+ # not an alternative favicon is specified in the HTML.
+ # Manual resizing and padding of "assets/drake-dragon.png" to 32x32px
+ # and conversion to ICO format.
+ "favicon.ico",
+ # Manual resizing and padding of "assets/drake-dragon.png" to 32x32px.
+ "favicon.png",
+ # Mask icon for Safari pinned tabs.
+ # Manual removal of colors and layers from "assets/drake-dragon.svg"
+ # and transformation to a 0 0 16 16 view box.
+ "mask-icon.svg",
+ # Site manifest primarily for Android and Chrome.
+ # https://developer.mozilla.org/en-US/docs/Web/Manifest
+ "site.webmanifest",
+ ],
+)
+
filegroup(
name = "images",
srcs = [
"images/drake-dragon.png",
"images/drake-logo.svg",
"images/drake-logo-white.svg",
- "images/favicon.png",
"images/jenkins_bot_reviewable_comment.png",
],
)
@@ -77,6 +109,7 @@ filegroup(
"assets/**/*.js",
]),
data = [
+ ":favicon",
":images",
":third_party_data",
],
diff --git a/doc/_layouts/default.html b/doc/_layouts/default.html
index 44ad4cea83af..74a0798be432 100644
--- a/doc/_layouts/default.html
+++ b/doc/_layouts/default.html
@@ -1,9 +1,13 @@
+
-
+
+
+
+
Drake: {{ page.title }}
+
+
+
diff --git a/doc/favicon.ico b/doc/favicon.ico
new file mode 100644
index 000000000000..a2b0dd72e239
Binary files /dev/null and b/doc/favicon.ico differ
diff --git a/doc/favicon.png b/doc/favicon.png
new file mode 100644
index 000000000000..fdf7b35593e0
Binary files /dev/null and b/doc/favicon.png differ
diff --git a/doc/images/favicon.README.txt b/doc/images/favicon.README.txt
deleted file mode 100644
index e00a85747cb2..000000000000
--- a/doc/images/favicon.README.txt
+++ /dev/null
@@ -1 +0,0 @@
-The `favicon.png` is generated from instructions in `drake-dragon.README.txt`.
diff --git a/doc/images/favicon.png b/doc/images/favicon.png
deleted file mode 100644
index 5a754fb09893..000000000000
Binary files a/doc/images/favicon.png and /dev/null differ
diff --git a/doc/mask-icon.svg b/doc/mask-icon.svg
new file mode 100644
index 000000000000..3b53b47d828a
--- /dev/null
+++ b/doc/mask-icon.svg
@@ -0,0 +1,98 @@
+
+
+
diff --git a/doc/site.webmanifest b/doc/site.webmanifest
new file mode 100644
index 000000000000..f3773ab10238
--- /dev/null
+++ b/doc/site.webmanifest
@@ -0,0 +1,12 @@
+{
+ "name": "Drake",
+ "icons": [
+ {
+ "src": "android-chrome.png",
+ "sizes": "192x192",
+ "type": "image/png"
+ }
+ ],
+ "background_color": "#000000",
+ "theme_color": "#990000"
+}