meta data for this page
  •  

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
section:section-dynamic_color_customize [2026/07/21 11:43] – dorepssection:section-dynamic_color_customize [2026/07/31 12:57] (current) – doreps
Line 1: Line 1:
-====== Customizing: Total Launcher Dynamic Color Scheme ======+===== Total Launcher Dynamic Color Guide: Material You Customization =====
  
-----+Total Launcher features a Dynamic Color Scheme designed to integrate Android's Material You engine directly into custom homescreen layouts. By automatically harmonizing interface elements with active wallpapers, the system creates cohesive visual designs without requiring manual hex code adjustments. 
  
-{{  https://img.shields.io/badge/WIKI-HELP_WANTED-blueviolet.png?350&style=for-the-badge  }} +{{  :section:section-dynamic_color-customize-colors_visual.webp?direct&500 |Total Launcher Dynamic Color Overview  }}
- +
-This has been a mystery with Total Launcher since the developer, ChYK, has not published an explanation of how Dynamic Color works within the launcher. The explanation given here is based on Material 3 descriptions. If //any user// has established a setup using the ''Edit mode'' > ''Launcher Options'' > ''UI & Animation'' > ''Dynamic color scheme'' path, uiTLM would encourage comments on the experience and how this page might be better presented to our users. Use the **Discussion** section below or the **Quick Help** in the left sidebar.  +
- +
----- +
- +
-{{  :tl_custom_colors-visual.webp?direct&500 |Total Launcher Dynamic Color Overview  }}+
  
 ==== What it Does ==== ==== What it Does ====
-Total Launcher leverages Android's **Material You (M3)** system to create a harmonized look for the home screen. Instead of manually picking a color for every text or icon, it is assigned as a **Role**. If desired, some additional background on how Material Design evolved through its iterations to the current Material You v3 can be viewed ++++here.|+Total Launcher leverages Android's **Material You (M3)** system to create a harmonized look for the home screen. Instead of manually picking a color for every text or icon, an object is assigned a **Role**. 
  
-What it does is complicated, but some history may help.+Google introduced Material Design in 2014 to standardize Android UIs, evolved it into Material Theming in 2018, and released **Material You (M3)** in 2021 based on the philosophy of "Form Follows Feeling." Its *Monet* engine extracts colors from your wallpaper to generate 5 tonal palettes with 13 shades each, applying them across the OS. Total Launcher hooks directly into these OS tokens.
  
-In 2014, Google believed the Android interface lacked consistency across apps. It released **Material Design**, a language that provided strict rules for grids, colors, and typography. Developers and users complained about the uniformity, which caused Google to loosen those standards with the release of **Material Theming** in 2018, where material components //could// be customized. But in 2021 Google moved away from "one size fits all" and offered the current **Material You** (aka Material Design v3), where users could have more control over how their device looked.+==== Turn It On ==== 
 +To enable the dynamic color engine across Total Launcher: 
 +  * ''Edit mode'' > ''Launcher options'' > ''UI & Animation'' > ''Dynamic Color Scheme'' [turn on]
  
-Material You used the philosophy of "Form Follows Feeling," with **Dynamic Color** being the major feature through its//monet engine//, which extracts colors from the wallpaper //or a chosen color//, expands the color to 5 tonal palettes with 13 shades each, and applies them to the entire system and supported apps. The concept is applied seamlessly across devices of many forms and introduces larger touch targets, more rounded shapes, and improved contrast to make technology easier for everyone to use. +==== How to Apply Dynamic Color to an Object ==== 
-+++++Once the global setting is on, assign dynamic colors to individual elements on the screen: 
 +  - Long-press any object (Text, Shape, Icon, or Image) and enter **Edit Mode**. 
 +  - Tap ''Options'' in the Object Design menu 
 +  - Select the specific element (text, background, image, etc.) 
 +  - In the dialog that opens, select ''Dynamic Color'' to open the Dynamic Color dialog and the role picker. 
 +  - For the object that was originally selected, now choose a **Role** (e.g., ''Primary'' for a main button, or ''On Primary'' for text inside that button). 
  
-==== Turn It On ====+**To detach an object from the dynamic wallpaper theme** and use a fixed color instead, select ''Custom Color'' at the top of that same dialog.
  
-To enable this engine:  
-  * ''Edit mode'' > ''Launcher options'' > ''UI & Animation'' > ''Dynamic Color Scheme'' [turn on] 
  
 ==== The Master Plan: A Museum Exhibit ==== ==== The Master Plan: A Museum Exhibit ====
-Think of the device screen as a **Museum Exhibit**. When  Material You (M3) is enabled, the system acts as a **"Master Curator."** The Curator’s job is to ensure that every part of the exhibit works together in perfect color harmony based on the "theme" (as per the wallpaper).+Think of your device screen as a **Museum Exhibit**. When Material You (M3) is enabled, the system acts as a **"Master Curator."** The Curator’s job is to ensure that every part of the exhibit works together in perfect color harmony based on the active wallpaper.
  
-Instead of picking random colors, **Roles** are assigned to the objects. These roles define the objects' "job" in the museum:+Instead of picking static colors, you assign **Roles** to your objects:
  
-  * **Primary (The Main Exhibit):** The "Star of the Show." Use for important search bars or main buttons. It wears the most vibrant color to make sure users see it first. +  * **Primary (The Main Exhibit):** The "Star of the Show." Use for key search bars or main action buttons. It wears the most vibrant color to grab immediate attention. 
-  * **Secondary (The Support Gallery):** Supporting actors. Use for less important icons or smaller widgets. These stay in the same "color family" as the Primary role but are muted. +  * **Secondary (The Support Gallery):** Supporting actors. Use for secondary icons or smaller widgets. They stay in the same color family as Primary, but are muted to keep the layout clean. 
-  * **Tertiary (The Highlight):** A single spotlight on a specific artifact. This is a "surprise" color that adds variety and "pop" (like a notification badge). +  * **Tertiary (The Highlight):** A single spotlight on a specific artifact. This is a "surprise" color that adds variety and "pop" (like a clock widget or a notification badge). 
-  * **Neutral & Surface (The Walls & Floor):** The building itself. Subtle background tones that allow the accented exhibits to shine. +  * **Neutral & Surface (The Walls & Floor):** The museum building itself. These provide subtle background tones that allow accented elements to shine. 
-  * **The "On" Roles (The Labels):** Clear labels required for reading. The **"On Primary"** or **"On Surface"** roles are text colors designed to be automatically readable against their specific background.+  * **The "On" Roles (The Labels):** Clear labels required for readability. **"On Primary"** or **"On Surface"** roles are text/icon colors engineered by the OS algorithm to guarantee high contrast against their respective background roles.
  
 ==== The Curator in Action ==== ==== The Curator in Action ====
-These samples show how the same objects (clock, icons, buttons) change their "costumes" automatically when the Curator changes the theme.+These samples demonstrate how the exact same objects (clock, icons, buttons) automatically shift their "costumes" whenever the Curator changes the system theme:
  
 <WRAP group> <WRAP group>
Line 54: Line 53:
 </WRAP> </WRAP>
 </WRAP> </WRAP>
 +
 +----
  
 ==== Dynamic Color Cheat Sheet ==== ==== Dynamic Color Cheat Sheet ====
-This table explains the difference between the **Dynamic Path** (following the Curator) and the **Custom Path** (the Rebel).+This table contrasts the **Dynamic Path** (listening to the OS Curator) with the **Custom Path** (the static override):
  
 <WRAP group> <WRAP group>
 <WRAP box center 90%> <WRAP box center 90%>
-^ If choosing ... ^ The Object follows... ^ Dynamic? ^ Best for... ^ +^ If choosing... ^ The Object follows... ^ Dynamic? ^ Best for... ^ 
-| **Custom color** | a manually assigned ARGB Codes | **NO** | Minimalist B/W or fixed brand colors. | +| **Custom color** | Manually assigned ARGB codes | **NO** | Minimalist B/W, fixed brand colors, or custom Day/Night themes. | 
-| **Primary** | Main System Accent | **YES** | Most important buttons and headings. | +| **Primary** | Main System Accent | **YES** | Most important buttons, headers, and primary actions. | 
-| **On Primary** | Contrast Algorithm | **YES** | Text on top of Primary backgrounds. | +| **On Primary** | OS Contrast Algorithm | **YES** | Text or icons placed on top of Primary backgrounds. | 
-| **Secondary** | Supporting Accent | **YES** | Less important widgets or accents. | +| **Secondary** | Supporting Accent | **YES** | Secondary widgets, filter chips, and sub-headers. | 
-| **Tertiary** | Complementary Accent | **YES** | "Pop" accents like clocks or badges. | +| **Tertiary** | Complementary Accent | **YES** | "Pop" accents like clocks, notification badges, or highlights. | 
-| **Surface** | System Background Tones | **YES** | Page backgrounds and subtle cards. |+| **Surface** | System Background Tones | **YES** | Page backgrounds, card containers, and tile bases. |
  
-**Note:** If the launcher shows "No Wallpaper," M3 defaults to a neutral "Baseline" (usually dark blue or grey). To see the dynamic effect clearly, temporarily set a vibrant wallpaper.+**Note:** If your launcher shows "No Wallpaper," M3 defaults to a neutral "Baseline" palette (usually dark blue or grey). To see the dynamic effect clearly, temporarily apply a vibrant wallpaper.
 </WRAP> </WRAP>
 </WRAP> </WRAP>
  
-Visual Guide to the Dialogs\\  +----
-^  TL Dynamic Color dialog: \\ Choosing a Role for your object  ^ +
-{{:ui:ui-dynamic_color.webp?200  }} +
-| | +
-| | +
-|* Primary | +
-|* On primary | +
-|* Primary container | +
-|* On primary container | +
-|* Secondary | +
-|* On secondary | +
-|* Secondary container | +
-|* On secondary container | +
-|* Tertiary | +
-|* On tertiary | +
-|* Tertiary container | +
-|* On tertiary container | +
-|* Error | +
-|* On error  * Error container | +
-|* On error container | +
-|* Surface | +
-|* On surface |+
  
 ==== Troubleshooting & Tips ==== ==== Troubleshooting & Tips ====
  
 <WRAP notice> <WRAP notice>
-**The colors aren't changing!**\\  +**My colors aren't changing!**\\  
-When wallpaper changes, but the "Primary" text stays grey or blue, try these steps:+If you change your wallpaper but your "Primary" text stays grey or blue, check the following:
 </WRAP> </WRAP>
  
-  * **The "Baseline" Trap:** If the wallpaper is neutral, M3 defaults to a grey/blue palette. Use a **vibrant wallpaper** to verify the system is working. +  * **The "Baseline" Trap:** If the wallpaper is solid black, white, or neutral, M3 defaults to a fallback grey/blue palette. Use a vibrant wallpaper to test system response. 
-  * **Sync Wallpaper:** Ensure ''Launcher options'' > ''UI & Animation'' > ''Sync system wallpaper'' is checked. +  * **Sync Wallpaper:** Ensure ''Launcher options'' > ''UI & Animation'' > ''Sync system wallpaper'' is enabled if you want Total Launcher's background to match your system. 
-  * **The "Force Refresh":** If the palette doesn't update:+  * **The "Force Refresh":** If Android fails to push the new palette tokens to Total Launcher:
     * Restart the launcher: ''Launcher options'' > ''Troubleshooting'' > ''Restart Total Launcher''.     * Restart the launcher: ''Launcher options'' > ''Troubleshooting'' > ''Restart Total Launcher''.
-    * Toggle the ''Dynamic color scheme'' option OFF and then ON again. +    * Toggle the ''Dynamic color scheme'' option OFF and back ON. 
-  * **Custom Overrides:** A **Custom Color** rule will always ignore the Dynamic "Role" script.+  * **Custom Overrides:** An object set to **Custom Color** completely detaches from the Material You script and will ignore wallpaper changes.
  
-==== Noted Issues ==== +----
- +
-There have been discussions on how Total Launcher has implemented its Dynamic Color Scheme and Dynamic Color dialog. Since the developer has not made background documentation available, questions will continue to arise. There may also be some additional thoughts posted in the discussion section at the bottom of this page. +
- +
-For those interested in reviewing other viewpoints, ++++click here| +
- +
-I am using a base wallpaper in my design (controlled by a third-party app called DualWallpaper that allows automatic changes to the lock and home screen wallpapers with Light/Dark mode), but only 70% is transparent. I have tried with a more colorful wallpaper, and the result for the Custom Color dialog is the same.  +
- +
-The more I use TL, the more I see it working as a GUI overlay on top of the Home UI (in my Samsung case). That gives it the possibility to reframe the roles of the GUI elements (buttons, menus, etc.) to what the user wants them to be. When constructing a home interface using TL, a button is a button only if the user decides it is. +
- +
-The connection with M3 can be implemented in the custom home interface as much as the user needs it and on the elements the user needs it, but the restrictions on how those colors are read from the M3 API by TL could be coming from the Google side.+
  
-... the Custom Color function in TL falls outside the direct M3 implementation and, as far as I can see, is an internal addition to its functionality, developed by the TL dev to give direct possibilities of using static colors for Day and Dark theme elements inside of the launcher.+==== Technical Architecture & Community Observations ====
  
-I think that the problem of not displaying the currently chosen colors when opening the custom colors dialog is either a technical inability to read any dynamic colors from a single selected object (no matter automatic - primary, secondary... or Custom) or it's an option missed in coding the Dynamic Colors implementation.+Total Launcher operates as a flexible GUI overlay running above the Android system UI. Understanding how it interfaces with Google's Material 3 API helps explain some of its unique dialog behaviors:
  
-... I am not sure if that's a bug or a technical limitation. +  * **Decoupled Roles:** Unlike standard launchers that apply dynamic colors universally across predefined grids, Total Launcher exposes the full M3 token list to individual objects. A button or text object only obeys Material You if you explicitly assign it an M3 role (`Primary`, `Secondary Container`, etc.). 
-+++++  * **Google API Boundaries:** Total Launcher queries live M3 color tokens directly from the system OS. If third-party wallpaper tools (like *DualWallpaper*) pass transparent or modified backgrounds to the OS, Total Launcher can only render the specific color tokens returned by Android. 
 +  * **The Custom Color Isolation:** The **Custom Color** option in the Dynamic Color dialog is a native, internal Total Launcher utility designed for static Day/Dark mode manual assignments. Because it operates entirely outside the Material You API, opening the Custom Color dialog will not pre-fill or "read" an object's current dynamic color—it functions as a separate override slate.
  
-<WRAP noprint>{{page>site:site-footer-comment_feedback_block}}</WRAP>