Convert various uses of Google Blue to color pipeline.

This is a behavior change.  Largely these were using blue 500 in both
light and dark mode; now they use the accent color (typically blue
600/300 in light/dark modes).  In a few cases other changes have been
made, e.g. adding dark mode support for the top container loading bar
or adjusting the colors in the quick answers view to be more consistent
between dark and light mode.

Bug: 1059923
Change-Id: I2b59d7a930c11ff5ad1c31e28c03014eccbfb877
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3547563
Commit-Queue: Peter Kasting <pkasting@chromium.org>
Reviewed-by: Allen Bauer <kylixrd@chromium.org>
Auto-Submit: Peter Kasting <pkasting@chromium.org>
Cr-Commit-Position: refs/heads/main@{#985013}

chrome/browser/ui/color/chrome_color_id.h

@@ -46,6 +46,8 @@
   /* Window caption colors. */ \
   E(kColorCaptionButtonBackground, \
     ThemeProperties::COLOR_CONTROL_BUTTON_BACKGROUND) \
+  /* Captured tab colors. */ \
+  E_CPONLY(kColorCapturedTabContentsBorder) \
   /* Desktop media tab list colors. */ \
   E_CPONLY(kColorDesktopMediaTabListBorder) \
   E_CPONLY(kColorDesktopMediaTabListPreviewBackground) \
@@ -59,9 +61,13 @@
     ThemeProperties::COLOR_DOWNLOAD_SHELF_CONTENT_AREA_SEPARATOR) \
   E(kColorDownloadShelfForeground, \
     ThemeProperties::COLOR_DOWNLOAD_SHELF_FOREGROUND) \
+  E_CPONLY(kColorDownloadStartedAnimationForeground) \
   E_CPONLY(kColorDownloadToolbarButtonActive) \
   E_CPONLY(kColorDownloadToolbarButtonInactive) \
   E_CPONLY(kColorDownloadToolbarButtonRingBackground) \
+  /* Extension colors. */ \
+  E_CPONLY(kColorExtensionIconBadgeBackgroundDefault) \
+  E_CPONLY(kColorExtensionIconBadgeForegroundDefault) \
   /* Eyedropper colors. */ \
   E_CPONLY(kColorEyedropperBoundary) \
   E_CPONLY(kColorEyedropperCentralPixelInnerRing) \
@@ -99,6 +105,10 @@
   E(kColorLocationBarBorder, ThemeProperties::COLOR_LOCATION_BAR_BORDER) \
   E(kColorLocationBarBorderOpaque, \
     ThemeProperties::COLOR_LOCATION_BAR_BORDER_OPAQUE) \
+  /* Media router colors. */ \
+  E_CPONLY(kColorMediaRouterIconActive) \
+  E_CPONLY(kColorMediaRouterIconError) \
+  E_CPONLY(kColorMediaRouterIconWarning) \
   /* New Tab Page colors. */ \
   E(kColorNewTabPageBackground, ThemeProperties::COLOR_NTP_BACKGROUND) \
   E(kColorNewTabPageHeader, ThemeProperties::COLOR_NTP_HEADER) \
@@ -202,6 +212,9 @@
   /* QR code colors. */ \
   E_CPONLY(kColorQrCodeBackground) \
   E_CPONLY(kColorQrCodeBorder) \
+  /* Quick Answers colors. */ \
+  E_CPONLY(kColorQuickAnswersReportQueryButtonBackground) \
+  E_CPONLY(kColorQuickAnswersReportQueryButtonForeground) \
   /* Read Later button colors. */ \
   E(kColorReadLaterButtonHighlight, \
     ThemeProperties::COLOR_READ_LATER_BUTTON_HIGHLIGHT) \
@@ -341,6 +354,8 @@
     ThemeProperties::COLOR_TAB_STROKE_FRAME_ACTIVE) \
   E(kColorTabStrokeFrameInactive, \
     ThemeProperties::COLOR_TAB_STROKE_FRAME_INACTIVE) \
+  E_CPONLY(kColorTabstripLoadingProgressBackground) \
+  E_CPONLY(kColorTabstripLoadingProgressForeground) \
   /* Thumbnail tab colors. */ \
   E_CPONLY(kColorThumbnailTabBackground) \
   E_CPONLY(kColorThumbnailTabForeground) \
@@ -369,6 +384,8 @@
     ThemeProperties::COLOR_TOOLBAR_TOP_SEPARATOR_FRAME_ACTIVE) \
   E(kColorToolbarTopSeparatorFrameInactive, \
     ThemeProperties::COLOR_TOOLBAR_TOP_SEPARATOR_FRAME_INACTIVE) \
+  /* WebAuthn colors. */ \
+  E_CPONLY(kColorWebAuthnPinTextfieldBottomBorder) \
   /* Web contents colors. */ \
   E_CPONLY(kColorWebContentsBackground) \
   E_CPONLY(kColorWebContentsBackgroundLetterboxing) \

chrome/browser/ui/color/chrome_color_mixer.cc

@@ -223,6 +223,7 @@ void AddChromeColorMixer(ui::ColorProvider* provider,
   mixer[kColorBookmarkDragImageIconBackground] = {
       kColorBookmarkDragImageForeground};
   mixer[kColorCaptionButtonBackground] = {SK_ColorTRANSPARENT};
+  mixer[kColorCapturedTabContentsBorder] = {ui::kColorAccent};
   mixer[kColorDesktopMediaTabListBorder] = {ui::kColorMidground};
   mixer[kColorDesktopMediaTabListPreviewBackground] = {ui::kColorMidground};
   mixer[kColorDownloadShelfBackground] = {kColorToolbar};
@@ -233,10 +234,14 @@ void AddChromeColorMixer(ui::ColorProvider* provider,
   mixer[kColorDownloadShelfContentAreaSeparator] = ui::AlphaBlend(
       kColorToolbarButtonIcon, kColorDownloadShelfBackground, 0x3A);
   mixer[kColorDownloadShelfForeground] = {kColorToolbarText};
+  mixer[kColorDownloadStartedAnimationForeground] = {ui::kColorAccent};
   mixer[kColorDownloadToolbarButtonActive] = {ui::kColorThrobber};
   mixer[kColorDownloadToolbarButtonInactive] = {kColorToolbarButtonIcon};
   mixer[kColorDownloadToolbarButtonRingBackground] = {
       SkColorSetA(kColorDownloadToolbarButtonInactive, 0x33)};
+  mixer[kColorExtensionIconBadgeBackgroundDefault] = {ui::kColorAccent};
+  mixer[kColorExtensionIconBadgeForegroundDefault] =
+      ui::GetColorWithMaxContrast(kColorExtensionIconBadgeBackgroundDefault);
   mixer[kColorEyedropperBoundary] = {SK_ColorDKGRAY};
   mixer[kColorEyedropperCentralPixelInnerRing] = {SK_ColorBLACK};
   mixer[kColorEyedropperCentralPixelOuterRing] = {SK_ColorWHITE};
@@ -266,6 +271,9 @@ void AddChromeColorMixer(ui::ColorProvider* provider,
   mixer[kColorLocationBarBorder] = {SkColorSetA(SK_ColorBLACK, 0x4D)};
   mixer[kColorLocationBarBorderOpaque] =
       ui::GetResultingPaintColor(kColorLocationBarBorder, kColorToolbar);
+  mixer[kColorMediaRouterIconActive] = {ui::kColorAccent};
+  mixer[kColorMediaRouterIconError] = {ui::kColorAlertHighSeverity};
+  mixer[kColorMediaRouterIconWarning] = {ui::kColorAlertMediumSeverity};
   mixer[kColorNewTabPageBackground] = {kColorToolbar};
   mixer[kColorNewTabPageHeader] = {SkColorSetRGB(0x96, 0x96, 0x96)};
   mixer[kColorNewTabPageLink] = {dark_mode ? gfx::kGoogleBlue300
@@ -325,6 +333,9 @@ void AddChromeColorMixer(ui::ColorProvider* provider,
                                              : gfx::kGoogleGreen600};
   mixer[kColorQrCodeBackground] = {SK_ColorWHITE};
   mixer[kColorQrCodeBorder] = {ui::kColorMidground};
+  mixer[kColorQuickAnswersReportQueryButtonBackground] =
+      ui::SetAlpha(ui::kColorAccent, 0x0A);
+  mixer[kColorQuickAnswersReportQueryButtonForeground] = {ui::kColorAccent};
   mixer[kColorReadLaterButtonHighlight] = {kColorAvatarButtonHighlightNormal};
   mixer[kColorScreenshotCapturedImageBackground] = {ui::kColorBubbleBackground};
   mixer[kColorScreenshotCapturedImageBorder] = {ui::kColorMidground};
@@ -500,6 +511,9 @@ void AddChromeColorMixer(ui::ColorProvider* provider,
   mixer[kColorTabStrokeFrameActive] = {kColorToolbarTopSeparatorFrameActive};
   mixer[kColorTabStrokeFrameInactive] = {
       kColorToolbarTopSeparatorFrameInactive};
+  mixer[kColorTabstripLoadingProgressBackground] =
+      ui::AlphaBlend(ui::kColorAccent, kColorToolbar, 0x32);
+  mixer[kColorTabstripLoadingProgressForeground] = {ui::kColorAccent};
   mixer[kColorThumbnailTabBackground] = ui::BlendForMinContrast(
       ui::kColorAccent, ui::kColorFrameActive, absl::nullopt,
       color_utils::kMinimumVisibleContrastRatio);
@@ -532,6 +546,7 @@ void AddChromeColorMixer(ui::ColorProvider* provider,
   mixer[kColorToolbarTopSeparatorFrameInactive] =
       GetToolbarTopSeparatorColorTransform(kColorToolbar,
                                            ui::kColorFrameInactive);
+  mixer[kColorWebAuthnPinTextfieldBottomBorder] = {ui::kColorAccent};
   mixer[kColorWebContentsBackground] = {kColorNewTabPageBackground};
   mixer[kColorWebContentsBackgroundLetterboxing] =
       ui::AlphaBlend(kColorWebContentsBackground, SK_ColorBLACK, 0x33);

chrome/browser/ui/extensions/extension_action_view_controller.cc

@@ -37,8 +37,10 @@
 #include "extensions/common/manifest_constants.h"
 #include "extensions/common/permissions/api_permission.h"
 #include "ui/base/l10n/l10n_util.h"
+#include "ui/color/color_provider_manager.h"
 #include "ui/gfx/image/image_skia.h"
 #include "ui/gfx/image/image_skia_operations.h"
+#include "ui/native_theme/native_theme.h"
 
 using extensions::ActionInfo;
 using extensions::CommandService;
@@ -462,8 +464,16 @@ ExtensionActionViewController::GetIconImageSource(
     content::WebContents* web_contents,
     const gfx::Size& size) {
   int tab_id = sessions::SessionTabHelper::IdForTab(web_contents).id();
-  std::unique_ptr<IconWithBadgeImageSource> image_source(
-      new IconWithBadgeImageSource(size));
+  // `web_contents` may be null during tab closure or in tests.  Fall back on a
+  // generic color provider.
+  const auto* const color_provider =
+      web_contents
+          ? &web_contents->GetColorProvider()
+          : ui::ColorProviderManager::Get().GetColorProviderFor(
+                ui::NativeTheme::GetInstanceForNativeUi()->GetColorProviderKey(
+                    nullptr));
+  auto image_source =
+      std::make_unique<IconWithBadgeImageSource>(size, color_provider);
 
   image_source->SetIcon(icon_factory_.GetIcon(tab_id));
 

chrome/browser/ui/extensions/icon_with_badge_image_source.cc

@@ -11,11 +11,13 @@
 #include "base/strings/utf_string_conversions.h"
 #include "build/build_config.h"
 #include "cc/paint/paint_flags.h"
+#include "chrome/browser/ui/color/chrome_color_id.h"
 #include "chrome/grit/theme_resources.h"
 #include "extensions/browser/extension_action.h"
 #include "third_party/skia/include/core/SkColor.h"
 #include "ui/base/resource/resource_bundle.h"
 #include "ui/base/ui_base_features.h"
+#include "ui/color/color_provider.h"
 #include "ui/gfx/canvas.h"
 #include "ui/gfx/color_palette.h"
 #include "ui/gfx/font.h"
@@ -55,8 +57,12 @@ IconWithBadgeImageSource::Badge::Badge(const std::string& text,
 
 IconWithBadgeImageSource::Badge::~Badge() {}
 
-IconWithBadgeImageSource::IconWithBadgeImageSource(const gfx::Size& size)
-    : gfx::CanvasImageSource(size) {}
+IconWithBadgeImageSource::IconWithBadgeImageSource(
+    const gfx::Size& size,
+    const ui::ColorProvider* color_provider)
+    : gfx::CanvasImageSource(size), color_provider_(color_provider) {
+  DCHECK(color_provider_);
+}
 
 IconWithBadgeImageSource::~IconWithBadgeImageSource() {}
 
@@ -71,9 +77,10 @@ void IconWithBadgeImageSource::SetBadge(std::unique_ptr<Badge> badge) {
     return;
 
   // Generate the badge's render text.
-  SkColor text_color = SkColorGetA(badge_->text_color) == SK_AlphaTRANSPARENT
-                           ? SK_ColorWHITE
-                           : badge_->text_color;
+  SkColor text_color =
+      SkColorGetA(badge_->text_color) == SK_AlphaTRANSPARENT
+          ? color_provider_->GetColor(kColorExtensionIconBadgeForegroundDefault)
+          : badge_->text_color;
 
   constexpr int kBadgeHeight = 12;
   ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
@@ -172,7 +179,7 @@ void IconWithBadgeImageSource::PaintBadge(gfx::Canvas* canvas) {
   // Make sure the background color is opaque. See http://crbug.com/619499
   SkColor background_color =
       SkColorGetA(badge_->background_color) == SK_AlphaTRANSPARENT
-          ? gfx::kGoogleBlue500
+          ? color_provider_->GetColor(kColorExtensionIconBadgeBackgroundDefault)
           : SkColorSetA(badge_->background_color, SK_AlphaOPAQUE);
   cc::PaintFlags rect_flags;
   rect_flags.setStyle(cc::PaintFlags::kFill_Style);

chrome/browser/ui/extensions/icon_with_badge_image_source.h

@@ -17,6 +17,10 @@ class RenderText;
 class Size;
 }
 
+namespace ui {
+class ColorProvider;
+}
+
 // CanvasImageSource for creating extension icon with a badge.
 class IconWithBadgeImageSource : public gfx::CanvasImageSource {
  public:
@@ -36,7 +40,8 @@ class IconWithBadgeImageSource : public gfx::CanvasImageSource {
     SkColor background_color;
   };
 
-  explicit IconWithBadgeImageSource(const gfx::Size& size);
+  IconWithBadgeImageSource(const gfx::Size& size,
+                           const ui::ColorProvider* color_provider);
 
   IconWithBadgeImageSource(const IconWithBadgeImageSource&) = delete;
   IconWithBadgeImageSource& operator=(const IconWithBadgeImageSource&) = delete;
@@ -76,6 +81,8 @@ class IconWithBadgeImageSource : public gfx::CanvasImageSource {
   // https://crbug.com/831946.
   gfx::Rect GetIconAreaRect() const;
 
+  const ui::ColorProvider* const color_provider_;
+
   // The base icon to draw.
   gfx::Image icon_;
 

chrome/browser/ui/quick_answers/BUILD.gn

@@ -40,6 +40,7 @@ source_set("quick_answers") {
     deps += [
       "//ash",
       "//chrome/browser/chromeos",
+      "//chrome/browser/ui/color:color_headers",
     ]
   }
 }

chrome/browser/ui/quick_answers/ui/quick_answers_view.cc

@@ -6,6 +6,7 @@
 
 #include "base/bind.h"
 #include "chrome/browser/profiles/profile_manager.h"
+#include "chrome/browser/ui/color/chrome_color_id.h"
 #include "chrome/browser/ui/quick_answers/quick_answers_ui_controller.h"
 #include "chrome/browser/ui/quick_answers/ui/quick_answers_pre_target_handler.h"
 #include "chromeos/components/quick_answers/quick_answers_model.h"
@@ -216,6 +217,9 @@ class ReportQueryView : public views::Button {
 
   explicit ReportQueryView(PressedCallback callback)
       : Button(std::move(callback)) {
+    SetBackground(views::CreateThemedSolidBackground(
+        this, kColorQuickAnswersReportQueryButtonBackground));
+
     auto* layout = SetLayoutManager(std::make_unique<views::FlexLayout>());
     layout->SetOrientation(views::LayoutOrientation::kHorizontal)
         .SetMainAxisAlignment(views::LayoutAlignment::kStart);
@@ -259,17 +263,9 @@ class ReportQueryView : public views::Button {
   void OnThemeChanged() override {
     views::Button::OnThemeChanged();
 
-    const bool should_use_dark_colors = GetNativeTheme()->ShouldUseDarkColors();
-
-    // Hard code color for dark mode since we use special specs for this
-    // temporary view. Will remove the usage after we remove this view.
-    const auto background_color =
-        should_use_dark_colors ? SkColorSetA(gfx::kGoogleBlue300, 0x4C /*30%*/)
-                               : gfx::kGoogleBlue050;
-    const auto foreground_color =
-        should_use_dark_colors ? gfx::kGoogleBlue300 : gfx::kGoogleBlue600;
-
-    SetBackground(views::CreateSolidBackground(background_color));
+    const auto* const color_provider = GetColorProvider();
+    const SkColor foreground_color =
+        color_provider->GetColor(kColorQuickAnswersReportQueryButtonForeground);
     dogfood_icon_->SetImage(gfx::CreateVectorIcon(
         vector_icons::kDogfoodIcon, kDogfoodIconSizeDip, foreground_color));
     description_label_->SetEnabledColor(foreground_color);

chrome/browser/ui/views/download/download_started_animation_views.cc

@@ -8,6 +8,7 @@
 #include "base/i18n/rtl.h"
 #include "base/time/time.h"
 #include "chrome/app/vector_icons/vector_icons.h"
+#include "chrome/browser/ui/color/chrome_color_id.h"
 #include "content/public/browser/web_contents.h"
 #include "ui/base/metadata/metadata_header_macros.h"
 #include "ui/base/metadata/metadata_impl_macros.h"
@@ -66,16 +67,16 @@ class DownloadStartedAnimationViews : public gfx::LinearAnimation,
 DownloadStartedAnimationViews::DownloadStartedAnimationViews(
     content::WebContents* web_contents)
     : gfx::LinearAnimation(kMoveTime, kFrameRateHz, nullptr), popup_(nullptr) {
-  gfx::ImageSkia download_image =
-      gfx::CreateVectorIcon(kFileDownloadShelfIcon, 72, gfx::kGoogleBlue500);
+  auto download_image = ui::ImageModel::FromVectorIcon(
+      kFileDownloadShelfIcon, kColorDownloadStartedAnimationForeground, 72);
 
   // If we're too small to show the download image, then don't bother -
   // the shelf will be enough.
   web_contents_bounds_ = web_contents->GetContainerBounds();
-  if (web_contents_bounds_.height() < download_image.height())
+  if (web_contents_bounds_.height() < download_image.Size().height())
     return;
 
-  SetImage(&download_image);
+  SetImage(download_image);
 
   popup_ = new views::Widget;
 

chrome/browser/ui/views/frame/top_container_loading_bar.cc

@@ -6,8 +6,10 @@
 
 #include "chrome/browser/favicon/favicon_utils.h"
 #include "chrome/browser/ui/browser.h"
+#include "chrome/browser/ui/color/chrome_color_id.h"
 #include "chrome/browser/ui/tab_ui_helper.h"
 #include "ui/base/metadata/metadata_impl_macros.h"
+#include "ui/color/color_provider.h"
 #include "ui/compositor/layer.h"
 #include "ui/gfx/animation/tween.h"
 #include "ui/gfx/canvas.h"
@@ -70,11 +72,16 @@ void LoadingBarView::SetLoadingProgress(double loading_progress) {
 
 void LoadingBarView::OnPaint(gfx::Canvas* canvas) {
   if (is_shown_when_not_animating_ || animation_.is_animating()) {
-    canvas->FillRect(GetLocalBounds(), gfx::kGoogleBlue100);
+    const auto* const color_provider = GetColorProvider();
+    canvas->FillRect(
+        GetLocalBounds(),
+        color_provider->GetColor(kColorTabstripLoadingProgressBackground));
     gfx::Rect progress_bounds(GetLocalBounds());
     progress_bounds.set_width(gfx::Tween::IntValueBetween(
         GetDisplayedLoadingProgress(), 0, progress_bounds.width()));
-    canvas->FillRect(progress_bounds, gfx::kGoogleBlue500);
+    canvas->FillRect(
+        progress_bounds,
+        color_provider->GetColor(kColorTabstripLoadingProgressForeground));
   }
 }
 

chrome/browser/ui/views/media_router/cast_toolbar_button.cc

@@ -7,6 +7,7 @@
 #include "base/bind.h"
 #include "chrome/browser/themes/theme_properties.h"
 #include "chrome/browser/ui/browser.h"
+#include "chrome/browser/ui/color/chrome_color_id.h"
 #include "chrome/browser/ui/layout_constants.h"
 #include "chrome/browser/ui/media_router/media_router_ui_service.h"
 #include "chrome/grit/generated_resources.h"
@@ -166,18 +167,19 @@ void CastToolbarButton::UpdateIcon() {
   const gfx::VectorIcon* new_icon = nullptr;
   SkColor icon_color;
 
+  const auto* const color_provider = GetColorProvider();
   if (severity == Severity::NOTIFICATION && !has_local_route_) {
     new_icon = &vector_icons::kMediaRouterIdleIcon;
     icon_color = gfx::kPlaceholderColor;
   } else if (severity == Severity::FATAL) {
     new_icon = &vector_icons::kMediaRouterErrorIcon;
-    icon_color = GetColorProvider()->GetColor(ui::kColorAlertHighSeverity);
+    icon_color = color_provider->GetColor(kColorMediaRouterIconError);
   } else if (severity == Severity::WARNING) {
     new_icon = &vector_icons::kMediaRouterWarningIcon;
-    icon_color = GetColorProvider()->GetColor(ui::kColorAlertMediumSeverity);
+    icon_color = color_provider->GetColor(kColorMediaRouterIconWarning);
   } else {
     new_icon = &vector_icons::kMediaRouterActiveIcon;
-    icon_color = gfx::kGoogleBlue500;
+    icon_color = color_provider->GetColor(kColorMediaRouterIconActive);
   }
 
   // This function is called when system theme changes. If an idle icon is

chrome/browser/ui/views/media_router/cast_toolbar_button_unittest.cc

@@ -11,6 +11,7 @@
 #include "chrome/browser/themes/theme_properties.h"
 #include "chrome/browser/themes/theme_service.h"
 #include "chrome/browser/ui/browser.h"
+#include "chrome/browser/ui/color/chrome_color_id.h"
 #include "chrome/browser/ui/media_router/media_router_ui_service.h"
 #include "chrome/browser/ui/media_router/media_router_ui_service_factory.h"
 #include "chrome/browser/ui/toolbar/media_router_contextual_menu.h"
@@ -108,12 +109,13 @@ class CastToolbarButtonTest : public ChromeViewsTestBase {
                                   ThemeProperties::COLOR_TOOLBAR_BUTTON_ICON)));
     warning_icon_ = gfx::Image(gfx::CreateVectorIcon(
         vector_icons::kMediaRouterWarningIcon,
-        color_provider->GetColor(ui::kColorAlertMediumSeverity)));
+        color_provider->GetColor(kColorMediaRouterIconWarning)));
     error_icon_ = gfx::Image(gfx::CreateVectorIcon(
         vector_icons::kMediaRouterErrorIcon,
-        color_provider->GetColor(ui::kColorAlertHighSeverity)));
+        color_provider->GetColor(kColorMediaRouterIconError)));
     active_icon_ = gfx::Image(gfx::CreateVectorIcon(
-        vector_icons::kMediaRouterActiveIcon, gfx::kGoogleBlue500));
+        vector_icons::kMediaRouterActiveIcon,
+        color_provider->GetColor(kColorMediaRouterIconActive)));
   }
 
   void TearDown() override {