1 <?xml version="1.0" encoding="utf-8"?>
2 <!-- This Source Code Form is subject to the terms of the Mozilla Public
3 - License, v. 2.0. If a copy of the MPL was not distributed with this
4 - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
5 <resources xmlns:tools="http://schemas.android.com/tools">
6 <!-- Design system color variables -->
9 <!-- Default Screen background, Frontlayer background, App Bar Top, App Bar Bottom, Frontlayer header -->
10 <color name="fx_mobile_layer_color_1">@color/photonLightGrey10</color>
11 <!-- Card background, Menu background, Dialog, Banner -->
12 <color name="fx_mobile_layer_color_2">@color/photonWhite</color>
14 <color name="fx_mobile_layer_color_3">@color/photonLightGrey20</color>
15 <color name="fx_mobile_layer_color_search">@color/photonLightGrey30</color>
16 <!-- App Bar Top (edit), Text Cursor, Selected Tab Check -->
17 <color name="fx_mobile_layer_color_accent">@color/photonInk20</color>
19 <color name="fx_mobile_layer_color_accent_nonopaque">@color/photonViolet70A12</color>
21 <color name="fx_mobile_layer_color_accent_opaque">#EAE4F9</color>
22 <color name="fx_mobile_layer_color_scrim">@color/photonDarkGrey30A95</color>
24 <color name="fx_mobile_layer_color_gradient_start">@color/photonViolet70</color>
26 <color name="fx_mobile_layer_color_gradient_end">@color/photonViolet60</color>
27 <!-- Warning background -->
28 <color name="fx_mobile_layer_color_warning" tools:ignore="UnusedResources">@color/photonYellow20</color>
29 <!-- Confirmation background -->
30 <color name="fx_mobile_layer_color_success" tools:ignore="UnusedResources">@color/photonGreen20</color>
31 <!-- Error background -->
32 <color name="fx_mobile_layer_color_critical" tools:ignore="UnusedResources">@color/photonRed10</color>
33 <!-- Info background -->
34 <color name="fx_mobile_layer_color_information" tools:ignore="UnusedResources">@color/photonBlue50A44</color>
37 <!-- Primary button, Snackbar, Floating action button, Chip selected -->
38 <color name="fx_mobile_action_color_primary">@color/photonInk20</color>
39 <!-- Primary button in a disabled state-->
40 <color name="fx_mobile_action_color_primary_disabled" tools:ignore="UnusedResources">@color/photonInk20A50</color>
41 <!-- Secondary button -->
42 <color name="fx_mobile_action_color_secondary">@color/photonLightGrey30</color>
44 <color name="fx_mobile_action_color_tertiary" tools:ignore="UnusedResources">@color/photonLightGrey40</color>
46 <color name="fx_mobile_action_color_quarternary" tools:ignore="UnusedResources">@color/photonLightGrey10</color>
47 <!-- Warning button -->
48 <color name="fx_mobile_action_color_warning" tools:ignore="UnusedResources">@color/photonYellow60A40</color>
49 <!-- Confirmation button -->
50 <color name="fx_mobile_action_color_success" tools:ignore="UnusedResources">@color/photonGreen60</color>
52 <color name="fx_mobile_action_color_critical" tools:ignore="UnusedResources">@color/photonRed30</color>
54 <color name="fx_mobile_action_color_information" tools:ignore="UnusedResources">@color/photonBlue50</color>
55 <!-- Checkbox default, Radio button default -->
56 <color name="fx_mobile_action_color_form_default" tools:ignore="UnusedResources">@color/photonDarkGrey90</color>
57 <!-- Checkbox selected, Radio button selected -->
58 <color name="fx_mobile_action_color_form_selected" tools:ignore="UnusedResources">@color/photonInk20</color>
59 <!-- Switch background OFF, Switch background ON -->
60 <color name="fx_mobile_action_color_form_surface" tools:ignore="UnusedResources">@color/photonLightGrey50</color>
61 <!-- Checkbox disabled, Radio disabled -->
62 <color name="fx_mobile_action_color_form_disabled" tools:ignore="UnusedResources">@color/photonLightGrey50</color>
63 <!-- Switch thumb ON -->
64 <color name="fx_mobile_action_color_form_on" tools:ignore="UnusedResources">@color/photonInk20</color>
65 <!-- Switch thumb OFF -->
66 <color name="fx_mobile_action_color_form_off" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
67 <!-- Scroll indicator active -->
68 <color name="fx_mobile_action_color_indicator_active">@color/photonLightGrey50</color>
69 <!-- Scroll indicator inactive -->
70 <color name="fx_mobile_action_color_indicator_inactive">@color/photonLightGrey30</color>
74 <color name="fx_mobile_text_color_primary">@color/photonDarkGrey90</color>
75 <!-- Secondary text -->
76 <color name="fx_mobile_text_color_secondary">@color/photonDarkGrey05</color>
77 <!-- Disabled text -->
78 <color name="fx_mobile_text_color_disabled">@color/photonDarkGrey90A40</color>
80 <color name="fx_mobile_text_color_critical">@color/photonRed70</color>
81 <!-- Warning text on Secondary button -->
82 <color name="fx_mobile_text_color_critical_button">@color/photonRed70</color>
83 <!-- Small heading, Text link -->
84 <color name="fx_mobile_text_color_accent">@color/photonViolet70</color>
85 <!-- Small heading, Text link -->
86 <color name="fx_mobile_text_color_accent_disabled" tools:ignore="UnusedResources">@color/photonViolet70A80</color>
87 <!-- Text Inverted/On Color -->
88 <color name="fx_mobile_text_color_oncolor_primary">@color/photonLightGrey05</color>
89 <!-- Text Inverted/On Color -->
90 <color name="fx_mobile_text_color_oncolor_secondary">@color/photonLightGrey40</color>
91 <!-- Action Primary text -->
92 <color name="fx_mobile_text_color_action_primary">@color/photonLightGrey05</color>
93 <!-- Action Primary disabled text -->
94 <color name="fx_mobile_text_color_action_primary_disabled" tools:ignore="UnusedResources">@color/photonLightGrey05A60</color>
95 <!-- Action Secondary text -->
96 <color name="fx_mobile_text_color_action_secondary">@color/photonDarkGrey90</color>
97 <!-- Action Tertiary text -->
98 <color name="fx_mobile_text_color_action_tertiary" tools:ignore="UnusedResources">@color/photonDarkGrey90</color>
99 <!-- Action Tertiary Active text -->
100 <color name="fx_mobile_text_color_action_tertiary_active" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
103 <!-- Primary icon -->
104 <color name="fx_mobile_icon_color_primary">@color/photonDarkGrey90</color>
105 <!-- Inactive tab -->
106 <color name="fx_mobile_icon_color_primary_inactive">@color/photonDarkGrey90A60</color>
107 <!-- Secondary icon -->
108 <color name="fx_mobile_icon_color_secondary">@color/photonDarkGrey05</color>
110 <color name="fx_mobile_icon_color_active">@color/photonInk20</color>
111 <!-- Disabled icon -->
112 <color name="fx_mobile_icon_color_disabled" tools:ignore="UnusedResources">@color/photonDarkGrey90A40</color>
113 <!-- Icon inverted (on color) -->
114 <color name="fx_mobile_icon_color_oncolor">@color/photonLightGrey05</color>
116 <color name="fx_mobile_icon_color_information">@color/photonBlue30</color>
118 <color name="fx_mobile_icon_color_button" tools:ignore="UnusedResources">@color/photonInk20</color>
119 <color name="fx_mobile_icon_color_critical" tools:ignore="UnusedResources">@color/photonRed70</color>
120 <!-- Warning icon on Secondary button -->
121 <color name="fx_mobile_icon_color_critical_button">@color/photonRed70</color>
122 <color name="fx_mobile_icon_color_accent_violet">@color/photonViolet70</color>
123 <color name="fx_mobile_icon_color_accent_blue">@color/photonBlue60</color>
124 <color name="fx_mobile_icon_color_accent_pink">@color/photonPink60</color>
125 <color name="fx_mobile_icon_color_accent_green">@color/photonGreen60</color>
126 <color name="fx_mobile_icon_color_accent_yellow">@color/photonYellow60</color>
127 <!-- Action Primary Icon -->
128 <color name="fx_mobile_icon_color_action_primary" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
129 <!-- Action Secondary Icon -->
130 <color name="fx_mobile_icon_color_action_secondary">@color/photonDarkGrey90</color>
131 <!-- Action Tertiary Icon -->
132 <color name="fx_mobile_icon_color_action_tertiary" tools:ignore="UnusedResources">@color/photonDarkGrey90</color>
133 <!-- Reader, ETP Shield -->
134 <color name="fx_mobile_icon_color_gradient_start">@color/photonViolet50</color>
135 <!-- Reader, ETP Shield -->
136 <color name="fx_mobile_icon_color_gradient_end">@color/photonBlue60</color>
139 <!-- Default, Divider, Dotted -->
140 <color name="fx_mobile_border_color_primary">@color/photonLightGrey30</color>
141 <color name="fx_mobile_border_color_secondary">@color/photonLightGrey20</color>
142 <!-- Toolbar divider -->
143 <color name="fx_mobile_border_color_toolbar_divider">@color/photonLightGrey10</color>
145 <color name="fx_mobile_border_color_inverted" tools:ignore="UnusedResources">@color/photonDarkGrey05</color>
147 <color name="fx_mobile_border_color_form_default" tools:ignore="UnusedResources">@color/photonDarkGrey90</color>
148 <!-- Active tab (Nav), Selected tab, Active form -->
149 <color name="fx_mobile_border_color_accent">@color/photonInk20</color>
151 <color name="fx_mobile_border_color_disabled" tools:ignore="UnusedResources">@color/photonDarkGrey90A40</color>
153 <color name="fx_mobile_border_color_critical" tools:ignore="UnusedResources">@color/photonRed70</color>
155 <!-- Private theme color variables -->
158 <!-- Default Screen background, Frontlayer background, App Bar Top, App Bar Bottom, Frontlayer header -->
159 <color name="fx_mobile_private_layer_color_1">@color/photonViolet90</color>
160 <!-- Card background, Menu background, Dialog, Banner -->
161 <color name="fx_mobile_private_layer_color_2">@color/photonViolet90</color>
163 <color name="fx_mobile_private_layer_color_3">@color/photonInk90</color>
164 <color name="fx_mobile_private_layer_color_search">@color/photonInk90</color>
165 <!-- Homescreen background, Toolbar -->
166 <color name="fx_mobile_private_layer_color_4_start">@color/photonPurple70</color>
167 <!-- Homescreen background, Toolbar -->
168 <color name="fx_mobile_private_layer_color_4_center">@color/photonViolet80</color>
169 <!-- Homescreen background, Toolbar -->
170 <color name="fx_mobile_private_layer_color_4_end">@color/photonInk05</color>
171 <!-- App Bar Top (edit), Text Cursor, Selected Tab Check -->
172 <color name="fx_mobile_private_layer_color_accent" tools:ignore="UnusedResources">@color/photonViolet40</color>
173 <!-- Selected tab -->
174 <color name="fx_mobile_private_layer_color_accent_nonopaque">@color/photonViolet50A32</color>
175 <!-- Selected tab -->
176 <color name="fx_mobile_private_layer_color_accent_opaque" tools:ignore="UnusedResources">#423262</color>
177 <color name="fx_mobile_private_layer_color_scrim">@color/photonDarkGrey90A95</color>
179 <color name="fx_mobile_private_layer_color_gradient_start" tools:ignore="UnusedResources">@color/photonViolet70</color>
181 <color name="fx_mobile_private_layer_color_gradient_end" tools:ignore="UnusedResources">@color/photonViolet40</color>
184 <!-- Primary button, Snackbar, Floating action button, Chip selected -->
185 <color name="fx_mobile_private_action_color_primary">@color/photonViolet60</color>
186 <!-- Secondary button -->
187 <color name="fx_mobile_private_action_color_secondary" tools:ignore="UnusedResources">@color/photonDarkGrey05</color>
189 <color name="fx_mobile_private_action_color_tertiary" tools:ignore="UnusedResources">@color/photonDarkGrey10</color>
191 <color name="fx_mobile_private_action_quarternary" tools:ignore="UnusedResources">@color/photonDarkGrey80</color>
192 <!-- Checkbox default, Radio button default -->
193 <color name="fx_mobile_private_action_color_form_default" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
194 <!-- Checkbox selected, Radio button selected -->
195 <color name="fx_mobile_private_action_color_form_selected" tools:ignore="UnusedResources">@color/photonViolet40</color>
196 <!-- Switch background OFF, Switch background ON -->
197 <color name="fx_mobile_private_action_color_form_surface" tools:ignore="UnusedResources">@color/photonDarkGrey05</color>
198 <!-- Checkbox disabled, Radio disabled -->
199 <color name="fx_mobile_private_action_color_form_disabled" tools:ignore="UnusedResources">@color/photonDarkGrey05</color>
200 <!-- Switch thumb ON -->
201 <color name="fx_mobile_private_action_color_form_on" tools:ignore="UnusedResources">@color/photonViolet40</color>
202 <!-- Switch thumb OFF -->
203 <color name="fx_mobile_private_action_color_form_off" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
204 <!-- Scroll indicator active -->
205 <color name="fx_mobile_private_action_color_indicator_active" tools:ignore="UnusedResources">@color/photonLightGrey90</color>
206 <!-- Scroll indicator inactive -->
207 <color name="fx_mobile_private_action_color_indicator_inactive" tools:ignore="UnusedResources">@color/photonDarkGrey05</color>
210 <!-- Primary text -->
211 <color name="fx_mobile_private_text_color_primary">@color/photonLightGrey05</color>
212 <!-- Secondary text -->
213 <color name="fx_mobile_private_text_color_secondary">@color/photonLightGrey40</color>
214 <!-- Disabled text -->
215 <color name="fx_mobile_private_text_color_disabled">@color/photonLightGrey05A40</color>
216 <!-- Warning text -->
217 <color name="fx_mobile_private_text_color_critical">@color/photonRed20</color>
218 <!-- Warning text on Secondary button -->
219 <color name="fx_mobile_private_text_color_critical_button" tools:ignore="UnusedResources">@color/photonRed20</color>
220 <!-- Small heading, Text link -->
221 <color name="fx_mobile_private_text_color_accent">@color/photonViolet20</color>
222 <!-- Small heading, Text link -->
223 <color name="fx_mobile_private_text_color_accent_disabled" tools:ignore="UnusedResources">@color/photonViolet20A60</color>
224 <!-- Text Inverted/On Color -->
225 <color name="fx_mobile_private_text_color_oncolor_primary">@color/photonLightGrey05</color>
226 <!-- Text Inverted/On Color -->
227 <color name="fx_mobile_private_text_color_oncolor_secondary" tools:ignore="UnusedResources">@color/photonLightGrey40</color>
228 <!-- Action Primary text -->
229 <color name="fx_mobile_private_text_color_action_primary">@color/photonLightGrey05</color>
230 <!-- Action Secondary text -->
231 <color name="fx_mobile_private_text_color_action_secondary" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
232 <!-- Action Tertiary text -->
233 <color name="fx_mobile_private_text_color_action_tertiary" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
234 <!-- Action Tertiary Active text -->
235 <color name="fx_mobile_private_text_color_action_tertiary_active" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
238 <!-- Primary icon -->
239 <color name="fx_mobile_private_icon_color_primary">@color/photonLightGrey05</color>
240 <!-- Inactive tab -->
241 <color name="fx_mobile_private_icon_color_primary_inactive" tools:ignore="UnusedResources">@color/photonLightGrey05A60</color>
242 <!-- Secondary icon -->
243 <color name="fx_mobile_private_icon_color_secondary">@color/photonLightGrey40</color>
245 <color name="fx_mobile_private_icon_color_active">@color/photonViolet40</color>
246 <!-- Disabled icon -->
247 <color name="fx_mobile_private_icon_color_disabled" tools:ignore="UnusedResources">@color/photonLightGrey05A40</color>
248 <!-- Icon inverted (on color) -->
249 <color name="fx_mobile_private_icon_color_oncolor">@color/photonLightGrey05</color>
251 <color name="fx_mobile_private_icon_color_information" tools:ignore="UnusedResources">@color/photonBlue30</color>
253 <color name="fx_mobile_private_icon_color_button" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
254 <color name="fx_mobile_private_icon_color_critical" tools:ignore="UnusedResources">@color/photonRed20</color>
255 <!-- Warning icon on Secondary button -->
256 <color name="fx_mobile_private_icon_color_critical_button" tools:ignore="UnusedResources">@color/photonRed20</color>
257 <color name="fx_mobile_private_icon_color_accent_violet" tools:ignore="UnusedResources">@color/photonViolet20</color>
258 <color name="fx_mobile_private_icon_color_accent_blue" tools:ignore="UnusedResources">@color/photonBlue20</color>
259 <color name="fx_mobile_private_icon_color_accent_pink" tools:ignore="UnusedResources">@color/photonPink20</color>
260 <color name="fx_mobile_private_icon_color_accent_green" tools:ignore="UnusedResources">@color/photonGreen20</color>
261 <color name="fx_mobile_private_icon_color_accent_yellow" tools:ignore="UnusedResources">@color/photonYellow20</color>
262 <!-- Action Primary Icon -->
263 <color name="fx_mobile_private_icon_color_action_primary" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
264 <!-- Action Secondary Icon -->
265 <color name="fx_mobile_private_icon_color_action_secondary" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
266 <!-- Action Tertiary Icon -->
267 <color name="fx_mobile_private_icon_color_action_tertiary" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
268 <!-- Reader, ETP Shield -->
269 <color name="fx_mobile_private_icon_color_gradient_start" tools:ignore="UnusedResources">@color/photonViolet20</color>
270 <!-- Reader, ETP Shield -->
271 <color name="fx_mobile_private_icon_color_gradient_end" tools:ignore="UnusedResources">@color/photonBlue20</color>
274 <!-- Default, Divider, Dotted -->
275 <color name="fx_mobile_private_border_color_primary">@color/photonInk05</color>
276 <color name="fx_mobile_private_border_color_secondary">@color/photonInk10</color>
278 <color name="fx_mobile_private_border_color_inverted" tools:ignore="UnusedResources">@color/photonLightGrey30</color>
280 <color name="fx_mobile_private_border_color_form_default" tools:ignore="UnusedResources">@color/photonLightGrey05</color>
281 <!-- Active tab (Nav), Selected tab, Active form -->
282 <color name="fx_mobile_private_border_color_accent" tools:ignore="UnusedResources">@color/photonViolet40</color>
284 <color name="fx_mobile_private_border_color_disabled" tools:ignore="UnusedResources">@color/photonLightGrey05A40</color>
286 <color name="fx_mobile_private_border_color_critical" tools:ignore="UnusedResources">@color/photonRed20</color>
287 <!-- Toolbar divider -->
288 <color name="fx_mobile_private_border_color_toolbar_divider">@color/photonViolet80</color>
290 <!-- Light theme color palette -->
291 <color name="primary_text_light_theme">@color/photonInk80</color>
292 <color name="dark_grey_90_gradient_start">@color/photonDarkGrey90</color>
293 <color name="dark_grey_90_gradient_end">#0015141A</color>
295 <!-- Private theme color palette -->
296 <color name="accent_private_theme">@color/photonViolet50</color>
297 <color name="accent_high_contrast_private_theme">#AA71FF</color>
298 <color name="neutral_private_theme">@color/photonGrey20</color>
299 <color name="neutral_faded_private_theme">#1FFBFBFE</color>
300 <color name="sync_disconnected_icon_fill_private_theme">@color/photonYellow70</color>
301 <color name="sync_disconnected_background_private_theme">#5B5846</color>
302 <color name="prompt_login_edit_text_cursor_color_private_theme">@color/photonViolet50</color>
304 <!-- Normal theme colors for light mode -->
305 <color name="accent_normal_theme">@color/photonInk20</color>
306 <color name="accent_high_contrast_normal_theme">@color/photonInk20</color>
307 <color name="neutral_normal_theme">@color/photonGrey30</color>
308 <color name="neutral_faded_normal_theme">@color/photonGrey20</color>
309 <color name="fill_link_from_clipboard_normal_theme">@color/photonInk20</color>
310 <color name="sync_disconnected_icon_fill_normal_theme">@color/photonYellow70</color>
311 <color name="sync_disconnected_background_normal_theme">#FFFDE2</color>
312 <color name="add_on_private_browsing_exterior_circle_background_normal_theme">@color/photonViolet70</color>
313 <color name="prompt_login_edit_text_cursor_color_normal_theme">@color/photonInk20</color>
314 <color name="search_suggestion_indicator_icon_color_normal_theme">@color/photonGreen70</color>
315 <color name="search_suggestion_indicator_icon_bookmark_color_normal_theme">@color/photonBlue50</color>
317 <!-- Bookmark buttons -->
318 <color name="bookmark_favicon_background">#DFDFE3</color>
320 <!-- Quick action buttons-->
321 <color name="quick_action_reader_appearance_icon">#482166</color>
323 <!-- Toggle Colors -->
324 <color name="toggle_off_knob_dark_theme">@color/photonLightGrey05</color>
325 <color name="toggle_off_track_dark_theme">@color/photonLightGrey05</color>
326 <color name="toggle_off_knob_normal_theme">@color/photonGrey10</color>
327 <color name="toggle_off_track_normal_theme">@color/photonDarkGrey90</color>
329 <!-- Misc colors applied universally-->
330 <color name="suggestion_highlight_color">#5C592ACB</color>
331 <color name="text_scale_example_text_color">#232749</color>
332 <color name="sync_error_background_color">#FFF36E</color>
333 <color name="sync_error_text_color">@color/photonYellow90</color>
334 <color name="bottom_bar_shadow">#1A000000</color>
335 <color name="snackbar_error_color">#B52645</color>
337 <!-- Prompt colors -->
338 <color name="mozac_feat_prompt_cancel_save_dialog_text_color" tools:ignore="UnusedResources">@color/photonViolet70A80</color>
340 <!-- Reader View colors -->
341 <color name="mozac_feature_readerview_text_color" tools:ignore="UnusedResources">@color/fx_mobile_icon_color_primary</color>
342 <color name="mozac_feature_readerview_selected">@color/photonViolet40</color>
345 <color name="default_share_background">#E3E2E3</color>
346 <color name="device_type_desktop_background">#F091C3</color>
347 <color name="device_type_mobile_background">#D4C1FA</color>
348 <color name="device_foreground">@color/photonInk80</color>
350 <!-- Launcher Icon colors -->
351 <color name="ic_launcher_background">#FDFDFD</color>
353 <!-- Private Browsing Mode Persistent Notification -->
354 <color name="pbm_notification_color">@color/photonViolet70</color>
356 <!-- Static Shortcut Background Color -->
357 <color name="static_shortcut_background">#F5F5F5</color>
359 <!-- SearchView Hint Color -->
360 <color name="search_view_hint_color">@color/photonDarkGrey05</color>
362 <!-- Tab Counter colors -->
363 <color name="mozac_ui_tabcounter_default_tint" tools:ignore="UnusedResources">@color/fx_mobile_icon_color_primary</color>
364 <color name="mozac_ui_tabcounter_default_text" tools:ignore="UnusedResources">@color/fx_mobile_text_color_primary</color>
366 <!-- App Spinners colors -->
367 <color name="spinner_selected_item">#1415141A</color>
369 <!-- Material Design colors -->
370 <color name="material_scrim_color">#52000000</color>
372 <!-- Add-ons colors -->
373 <color name="mozac_feature_addons_error_text_color" tools:ignore="UnusedResources">@color/photonRed70</color>
375 <!-- Star icon fill colors -->
376 <color name="mozac_ic_star_filled">@color/photonBlack</color>
377 <color name="mozac_ic_star_unfilled">#D9D9D9</color>
379 <!-- Private Mode mask icon circle fill colors -->
380 <color name="mozac_ui_private_mode_circle_fill" tools:ignore="UnusedResources">@color/photonPurple60</color>