From ad61dc62e78fe25a080ab549b909366f1bae5178 Mon Sep 17 00:00:00 2001 From: stu Date: Wed, 27 Nov 2024 11:34:29 +0800 Subject: [PATCH] theme: use m3 beta theme colors --- CHANGELOG.md | 4 + client_code/theme.py | 322 ++++++++++++++++++++++++---------- docs/guides/modules/theme.rst | 6 +- 3 files changed, 236 insertions(+), 96 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index f7db1b2c..bf2439ab 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -22,6 +22,10 @@ https://github.com/anvilistas/anvil-extras/pull/572/files - persistence - LinkedAttribute is deprecated and will be removed in a future version https://github.com/anvilistas/anvil-extras/pull/578 +## Breaking Changes +* theme - the default colors have been updated to match the M3 (beta) theme + https://github.com/anvilistas/anvil-extras/pull/579 + # v3.0.0 ## Bug Fixes diff --git a/client_code/theme.py b/client_code/theme.py index 033487d1..78e273b2 100644 --- a/client_code/theme.py +++ b/client_code/theme.py @@ -12,9 +12,9 @@ M3_DEFAULT_SCHEMES = { "Material": { "dark": { + "On Primary": "#381E72", "Primary": "#D0BCFF", "Primary Container": "#4F378B", - "On Primary": "#371E73", "On Primary Container": "#EADDFF", "Secondary": "#CCC2DC", "Secondary Container": "#4A4458", @@ -26,31 +26,48 @@ "On Tertiary Container": "#FFD8E4", "Error": "#F2B8B5", "Background": "#1C1B1F", - "Surface": "#1C1B1F", - "On Background": "#E6E1E5", - "On Surface": "#E6E1E5", - "Surface Variant": "#49454F", - "On Surface Variant": "#CAC4D0", - "Outline": "#938F99", - "On Disabled": "rgba(230, 225, 229, 0.38)", - "Disabled Container": "rgba(230, 225, 229, 0.12)", - "Light Overlay 1": "rgba(232, 222, 248, 0.08)", - "Light Overlay 2": "rgba(232, 222, 248, 0.12)", - "Dark Overlay 1": "rgba(232, 222, 248, 0.08)", - "Dark Overlay 2": "rgba(232, 222, 248, 0.12)", + "Surface": "#111412", + "On Background": "#E1E3DF", + "On Surface": "#C5C7C3", + "Surface Variant": "#404943", + "On Surface Variant": "#C0C9C1", + "Outline": "#8A938C", + "Dark Overlay 1": "rgba(230, 224, 233, 0.08)", + "Dark Overlay 2": "rgba(230, 224, 233, 0.12)", + "Light Overlay 1": "rgba(230, 224, 233, 0.08)", + "Light Overlay 2": "rgba(230, 224, 233, 0.12)", + "Disabled Container": "rgba(230, 224, 233, 0.12)", + "On Disabled": "rgba(230, 224, 233, 0.38)", "Primary Overlay 1": "rgba(208, 188, 255, 0.05)", "Primary Overlay 2": "rgba(208, 188, 255, 0.08)", "Primary Overlay 3": "rgba(208, 188, 255, 0.11)", + "Outline Variant": "#49454F", + "On Error": "#601410", + "Surface Container Low": "#1D1B20", + "Surface Container Highest": "#36343B", + "Disabled Container 2": "rgba(230, 224, 233, 0.04)", + "Error Overlay 1": "rgba(242, 184, 181, 0.08)", + "Error Overlay 2": "rgba(242, 184, 181, 0.12)", + "Dark Overlay 3": "rgba(230, 224, 233,0.16)", + "On Error Container": "#F9DEDC", + "Surface Container": "#211F26", + "Inverse Surface": "#E6E0E9", + "Inverse On Surface": "#322F35", + "On Surface Variant Overlay 1": "rgba(202,196,208, 0.08)", + "On Surface Variant Overlay 2": "rgba(202,196,208, 0.12)", + "Inverse On Surface Overlay 1": "rgba(50,47,53, 0.08)", + "Inverse On Surface Overlay 2": "rgba(50,47,53, 0.12)", + "Surface Container High": "#2B2930", }, "light": { + "On Primary": "#FFFFFF", "Primary": "#6750A4", "Primary Container": "#EADDFF", - "On Primary": "#FFFFFF", "On Primary Container": "#21005E", "Secondary": "#625B71", "Secondary Container": "#E8DEF8", "On Secondary": "#FFFFFF", - "On Secondary Container": "#1E192B", + "On Secondary Container": "#1D192B", "Tertiary": "#7D5260", "Tertiary Container": "#FFD8E4", "On Tertiary": "#FFFFFF", @@ -63,23 +80,40 @@ "Surface Variant": "#E7E0EC", "On Surface Variant": "#49454E", "Outline": "#79747E", - "On Disabled": "rgba(28, 27, 31, 0.38)", - "Disabled Container": "rgba(28, 27, 31, 0.12)", + "Dark Overlay 1": "rgba(29, 25, 43, 0.08)", + "Dark Overlay 2": "rgba(29, 25, 43, 0.12)", "Light Overlay 1": "rgba(255, 255, 255, 0.08)", "Light Overlay 2": "rgba(255, 255, 255, 0.12)", - "Dark Overlay 1": "rgba(30, 25, 43, 0.08)", - "Dark Overlay 2": "rgba(30, 25, 43, 0.12)", + "Disabled Container": "rgba(29, 27, 32, 0.12)", + "On Disabled": "rgba(29, 27, 32, 0.38)", "Primary Overlay 1": "rgba(103, 80, 164, 0.05)", "Primary Overlay 2": "rgba(103, 80, 164, 0.08)", - "Primary Overlay 3": "rgba(103, 80, 164, 0.11)", + "Primary Overlay 3": "rgba(103, 80, 164, 0.12)", + "Outline Variant": "#C4C7C5", + "On Error": "#FFFFFF", + "Surface Container Low": "#F7F2FA", + "Surface Container Highest": "#E6E0E9", + "Disabled Container 2": "rgba(29, 27, 32, 0.04)", + "Error Overlay 1": "rgba(179, 38, 30, 0.08)", + "Error Overlay 2": "rgba(179, 38, 30, 0.12)", + "Dark Overlay 3": "rgba(29, 25, 43, 0.16)", + "On Error Container": "#410E0B", + "Surface Container": "#F3EDF7", + "Inverse Surface": "#322F35", + "Inverse On Surface": "#F5EFF7", + "On Surface Variant Overlay 1": "rgba(73,69,79, 0.08)", + "On Surface Variant Overlay 2": "rgba(73,69,79, 0.12)", + "Inverse On Surface Overlay 1": "rgba(245,239,247, 0.08)", + "Inverse On Surface Overlay 2": "rgba(245,239,247, 0.12)", + "Surface Container High": "#ECE6F0", }, }, "Rally": { "dark": { - "Primary": "#1EB980", - "Primary Container": "#005235", "On Primary": "#003824", - "On Primary Container": "#73FBBC", + "Primary": "#70DBA7", + "Primary Container": "#005235", + "On Primary Container": "#8DF7C2", "Secondary": "#B4CCBC", "Secondary Container": "#364B3F", "On Secondary": "#20352A", @@ -88,125 +122,193 @@ "Tertiary Container": "#234C5A", "On Tertiary": "#063542", "On Tertiary Container": "#C0E9FA", - "Error": "#D64D47", - "Background": "#191C1A", - "Surface": "#191C1A", + "Error": "#FFB4AB", + "Background": "#111412", + "Surface": "#111412", "On Background": "#E1E3DF", - "On Surface": "#E1E3DF", + "On Surface": "#C5C7C3", "Surface Variant": "#404943", "On Surface Variant": "#C0C9C1", "Outline": "#8A938C", - "On Disabled": "#85858B", - "Disabled Container": "rgba(133, 133, 139, 0.12)", - "Light Overlay 1": "rgba(208, 232, 216, 0.2)", - "Light Overlay 2": "rgba(208, 232, 216, 0.5)", - "Dark Overlay 1": "rgba(208, 232, 216, 0.2)", - "Dark Overlay 2": "rgba(208, 232, 216, 0.5)", - "Primary Overlay 1": "rgba(30, 185, 128, 0.05)", - "Primary Overlay 2": "rgba(30, 185, 128, 0.08)", - "Primary Overlay 3": "rgba(30, 185, 128, 0.11)", + "Dark Overlay 1": "rgba(208, 232, 216, 0.08)", + "Dark Overlay 2": "rgba(208, 232, 216, 0.12)", + "Light Overlay 1": "rgba(208, 232, 216, 0.08)", + "Light Overlay 2": "rgba(208, 232, 216, 0.12)", + "Disabled Container": "rgba(225, 227, 223, 0.12)", + "On Disabled": "rgba(225, 227, 223, 0.38)", + "Primary Overlay 1": "rgba(112, 219, 167, 0.05)", + "Primary Overlay 2": "rgba(112, 219, 167, 0.08)", + "Primary Overlay 3": "rgba(112, 219, 167, 0.11)", + "Outline Variant": "#404943", + "On Error": "#690005", + "Surface Container Low": "#191C1A", + "Surface Container Highest": "#323633", + "Disabled Container 2": "rgba(225, 227, 223, 0.04)", + "Error Overlay 1": "rgba(255, 180, 171, 0.08)", + "Error Overlay 2": "rgba(255, 180, 171, 0.12)", + "Dark Overlay 3": "rgba(208, 232, 216, 0.16)", + "On Error Container": "#FFDAD6", + "Surface Container": "#1D201E", + "Inverse Surface": "#E1E3DF", + "Inverse On Surface": "#191C1A", + "On Surface Variant Overlay 1": "rgba(192,201,193, 0.08)", + "On Surface Variant Overlay 2": "rgba(192,201,193, 0.12)", + "Inverse On Surface Overlay 1": "rgba(25,28,26, 0.08)", + "Inverse On Surface Overlay 2": "rgba(25,28,26, 0.12)", + "Surface Container High": "#262B27", }, "light": { - "Primary": "#006C48", - "Primary Container": "#00A36C", "On Primary": "#FFFFFF", + "Primary": "#006C48", + "Primary Container": "#8DF7C2", "On Primary Container": "#002113", - "Secondary": "#496455", - "Secondary Container": "#CBEAD6", + "Secondary": "#4D6356", + "Secondary Container": "#D0E8D8", "On Secondary": "#FFFFFF", - "On Secondary Container": "#052014", - "Tertiary": "#326576", - "Tertiary Container": "#B8EAFF", + "On Secondary Container": "#0A1F15", + "Tertiary": "#3C6472", + "Tertiary Container": "#C0E9FA", "On Tertiary": "#FFFFFF", "On Tertiary Container": "#001F28", - "Error": "#D64D47", + "Error": "#BA1A1A", "Background": "#FBFDF8", - "Surface": "#FBFDF8", + "Surface": "#F8FAF6", "On Background": "#191C1A", "On Surface": "#191C1A", "Surface Variant": "#DCE5DD", "On Surface Variant": "#404943", "Outline": "#707973", - "On Disabled": "rgba(25, 28, 26, 0.38)", - "Disabled Container": "rgba(25, 28, 26, 0.12)", - "Light Overlay 1": "rgba(255, 255, 255, 0.8)", + "Dark Overlay 1": "rgba(10, 31, 21, 0.08)", + "Dark Overlay 2": "rgba(10, 31, 21, 0.12)", + "Light Overlay 1": "rgba(255, 255, 255, 0.08)", "Light Overlay 2": "rgba(255, 255, 255, 0.12)", - "Dark Overlay 1": "rgba(5, 32, 20, 0.8)", - "Dark Overlay 2": "rgba(51, 51, 61, 0.12)", + "Disabled Container": "rgba(25, 28, 26, 0.12)", + "On Disabled": "rgba(25, 28, 26, 0.38)", "Primary Overlay 1": "rgba(0, 108, 72, 0.05)", "Primary Overlay 2": "rgba(0, 108, 72, 0.08)", "Primary Overlay 3": "rgba(0, 108, 72, 0.11)", + "Outline Variant": "#C0C9C1", + "On Error": "#FFFFFF", + "Surface Container Low": "#F2F4F0", + "Surface Container Highest": "#E1E3DF", + "Disabled Container 2": "rgba(25, 28, 26, 0.04)", + "Error Overlay 1": "rgba(186, 26, 26, 0.08)", + "Error Overlay 2": "rgba(186, 26, 26, 0.12)", + "Dark Overlay 3": "rgba(10, 31, 21, 0.16)", + "On Error Container": "#410002", + "Surface Container": "#ECEEEA", + "Inverse Surface": "#2E312F", + "Inverse On Surface": "#EFF1ED", + "On Surface Variant Overlay 1": "rgba(25,28,26, 0.08)", + "On Surface Variant Overlay 2": "rgba(25,28,26, 0.12)", + "Inverse On Surface Overlay 1": "rgba(239,241,237, 0.08)", + "Inverse On Surface Overlay 2": "rgba(239,241,237, 0.12)", + "Surface Container High": "#E4EAE3", }, }, "Mykonos": { "dark": { + "On Primary": "#00363D", "Primary": "#3CD9ED", "Primary Container": "#004F57", - "On Primary": "#00363D", "On Primary Container": "#96F0FF", - "Secondary": "#AFCBD0", - "Secondary Container": "#314B4F", - "On Secondary": "#1A3438", - "On Secondary Container": "#CBE8ED", - "Tertiary": "#B9C6ED", - "Tertiary Container": "#394667", - "On Tertiary": "#23304F", - "On Tertiary Container": "#DAE2FF", + "Secondary": "#B1CBD0", + "Secondary Container": "#334B4F", + "On Secondary": "#1C3438", + "On Secondary Container": "#CDE7EC", + "Tertiary": "#BAC6EA", + "Tertiary Container": "#3B4664", + "On Tertiary": "#24304D", + "On Tertiary Container": "##DAE2FF", "Error": "#FFB4AB", - "Background": "#191C1D", - "Surface": "#191C1D", + "Background": "#101415", + "Surface": "#101415", "On Background": "#E1E3E3", - "On Surface": "#E1E3E3", + "On Surface": "#C4C7C7", "Surface Variant": "#3F484A", "On Surface Variant": "#BFC8CA", "Outline": "#899294", - "On Disabled": "rgba(225, 227, 227, 0.38)", - "Disabled Container": "rgba(225, 227, 227, 0.12)", - "Light Overlay 1": "rgba(203, 232, 237, 0.08)", - "Light Overlay 2": "rgba(203, 232, 237, 0.12)", "Dark Overlay 1": "rgba(203, 232, 237, 0.08)", "Dark Overlay 2": "rgba(203, 232, 237, 0.12)", + "Light Overlay 1": "rgba(203, 232, 237, 0.08)", + "Light Overlay 2": "rgba(203, 232, 237, 0.12)", + "Disabled Container": "rgba(225, 227, 227, 0.12)", + "On Disabled": "rgba(225, 227, 227, 0.38)", "Primary Overlay 1": "rgba(60, 217, 237, 0.05)", "Primary Overlay 2": "rgba(60, 217, 237, 0.08)", "Primary Overlay 3": "rgba(60, 217, 237, 0.11)", + "Outline Variant": "#3F484A", + "On Error": "#690005", + "Surface Container Low": "#191C1D", + "Surface Container Highest": "#323536", + "Disabled Container 2": "rgba(225, 227, 227, 0.04)", + "Error Overlay 1": "rgba(255, 180, 171, 0.08)", + "Error Overlay 2": "rgba(255, 180, 171, 0.12)", + "Dark Overlay 3": "rgba(203, 232, 237, 0.16)", + "On Error Container": "#FFDAD6", + "Surface Container": "#1D2021", + "Inverse Surface": "#E1E3E3", + "Inverse On Surface": "#191C1D", + "On Surface Variant Overlay 1": "rgba(191,200,202, 0.08)", + "On Surface Variant Overlay 2": "rgba(191,200,202, 0.12)", + "Inverse On Surface Overlay 1": "rgba(25,28,29, 0.08)", + "Inverse On Surface Overlay 2": "rgba(25,28,29, 0.12)", + "Surface Container High": "#252B2C", }, "light": { + "On Primary": "#FFFFFF", "Primary": "#006874", "Primary Container": "#96F0FF", - "On Primary": "#FFFFFF", "On Primary Container": "#001F24", - "Secondary": "#486367", - "Secondary Container": "#CBE8ED", + "Secondary": "#4A6267", + "Secondary Container": "#CDE7EC", "On Secondary": "#FFFFFF", - "On Secondary Container": "#031F23", - "Tertiary": "#515E80", + "On Secondary Container": "#051F23", + "Tertiary": "#535E7E", "Tertiary Container": "#DAE2FF", "On Tertiary": "#FFFFFF", - "On Tertiary Container": "#0C1A39", + "On Tertiary Container": "#0F1A37", "Error": "#BA1A1A", - "Background": "#FAFDFD", - "Surface": "#FAFDFD", + "Background": "#FBFCFD", + "Surface": "#F8FAFA", "On Background": "#191C1D", "On Surface": "#191C1D", "Surface Variant": "#DBE4E6", "On Surface Variant": "#3F484A", "Outline": "#6F797A", - "On Disabled": "rgba(25, 28, 29, 0.38)", - "Disabled Container": "rgba(25, 28, 29, 0.12)", - "Light Overlay 1": "rgba(255, 255, 255, 0.08)", - "Light Overlay 2": "rgba(255, 255, 255, 0.12)", "Dark Overlay 1": "rgba(3, 31, 35, 0.08)", "Dark Overlay 2": "rgba(3, 31, 35, 0.12)", + "Light Overlay 1": "rgba(255, 255, 255, 0.08)", + "Light Overlay 2": "rgba(255, 255, 255, 0.12)", + "Disabled Container": "rgba(25, 28, 29, 0.12)", + "On Disabled": "rgba(25, 28, 29, 0.38)", "Primary Overlay 1": "rgba(0, 104, 116, 0.05)", "Primary Overlay 2": "rgba(0, 104, 116, 0.08)", "Primary Overlay 3": "rgba(0, 104, 116, 0.11)", + "Outline Variant": "#BFC8CA", + "On Error": "#FFFFFF", + "Surface Container Low": "#F2F4F4", + "Surface Container Highest": "#E1E3E3", + "Disabled Container 2": "rgba(25, 28, 29, 0.04)", + "Error Overlay 1": "rgba(186, 26, 26, 0.08)", + "Error Overlay 2": "rgba(186, 26, 26, 0.12)", + "Dark Overlay 3": "rgba(3, 31, 35, 0.16)", + "On Error Container": "#410002", + "Surface Container": "#ECEEEF", + "Inverse Surface": "#2E3132", + "Inverse On Surface": "#EFF1F1", + "On Surface Variant Overlay 1": "rgba(219,228,230, 0.08)", + "On Surface Variant Overlay 2": "rgba(219,228,230, 0.12)", + "Inverse On Surface Overlay 1": "rgba(239,241,241, 0.08)", + "Inverse On Surface Overlay 2": "rgba(239,241,241, 0.12)", + "Surface Container High": "#E3E9EA", }, }, "Manarola": { "dark": { + "On Primary": "#5B1A00", "Primary": "#FFB59B", "Primary Container": "#7B2E0E", - "On Primary": "#5B1A00", "On Primary Container": "#FFDBCF", "Secondary": "#E7BDB0", "Secondary Container": "#5D4036", @@ -217,27 +319,44 @@ "On Tertiary": "#393005", "On Tertiary Container": "#F2E2A7", "Error": "#FFB4AB", - "Background": "#201A18", - "Surface": "#201A18", + "Background": "#181210", + "Surface": "#181210", "On Background": "#EDE0DC", - "On Surface": "#EDE0DC", + "On Surface": "#D0C4C0", "Surface Variant": "#53433E", "On Surface Variant": "#D8C2BB", "Outline": "#A08D86", - "On Disabled": "rgba(237, 224, 220, 0.38)", - "Disabled Container": "rgba(237, 224, 220, 0.12)", - "Light Overlay 1": "rgba(255, 219, 207, 0.08)", - "Light Overlay 2": "rgba(255, 219, 207, 0.12)", "Dark Overlay 1": "rgba(255, 219, 207, 0.08)", "Dark Overlay 2": "rgba(255, 219, 207, 0.12)", + "Light Overlay 1": "rgba(255, 219, 207, 0.08)", + "Light Overlay 2": "rgba(255, 219, 207, 0.12)", + "Disabled Container": "rgba(237, 224, 220, 0.12)", + "On Disabled": "rgba(237, 224, 220, 0.38)", "Primary Overlay 1": "rgba(255, 181, 155, 0.05)", "Primary Overlay 2": "rgba(255, 181, 155, 0.08)", "Primary Overlay 3": "rgba(255, 181, 155, 0.11)", + "Outline Variant": "#53433E", + "On Error": "#690005", + "Surface Container Low": "#201A18", + "Surface Container Highest": "#3B3331", + "Disabled Container 2": "rgba(237, 224, 220, 0.04)", + "Error Overlay 1": "rgba(255, 180, 171, 0.08)", + "Error Overlay 2": "rgba(255, 180, 171, 0.12)", + "Dark Overlay 3": "rgba(255, 219, 207, 0.16)", + "On Error Container": "#FFDAD6", + "Surface Container": "#251E1C", + "Inverse Surface": "#EDE0DC", + "Inverse On Surface": "#201A18", + "On Surface Variant Overlay 1": "rgba(216,194,187, 0.08)", + "On Surface Variant Overlay 2": "rgba(216,194,187, 0.12)", + "Inverse On Surface Overlay 1": "rgba(32,26,24, 0.08)", + "Inverse On Surface Overlay 2": "rgba(32,26,24, 0.12)", + "Surface Container High": "#322824", }, "light": { + "On Primary": "#FFFFFF", "Primary": "#9A4523", "Primary Container": "#FFDBCF", - "On Primary": "#FFFFFF", "On Primary Container": "#380D00", "Secondary": "#77574C", "Secondary Container": "#FFDBCF", @@ -248,22 +367,39 @@ "On Tertiary": "#FFFFFF", "On Tertiary Container": "#221B00", "Error": "#BA1A1A", - "Background": "#FFFBFF", - "Surface": "#FFFBFF", + "Background": "#FFF8F6", + "Surface": "#FFF8F6", "On Background": "#201A18", "On Surface": "#201A18", "Surface Variant": "#F5DED6", "On Surface Variant": "#53433E", "Outline": "#85736D", - "On Disabled": "rgba(32, 26, 24, 0.38)", - "Disabled Container": "rgba(32, 26, 24, 0.12)", - "Light Overlay 1": "rgba(255, 255, 255, 0.08)", - "Light Overlay 2": "rgba(255, 255, 255, 0.12)", "Dark Overlay 1": "rgba(44, 22, 13, 0.08)", "Dark Overlay 2": "rgba(44, 22, 13, 0.12)", + "Light Overlay 1": "rgba(255, 255, 255, 0.08)", + "Light Overlay 2": "rgba(255, 255, 255, 0.12)", + "Disabled Container": "rgba(32, 26, 24, 0.12)", + "On Disabled": "rgba(32, 26, 24, 0.38)", "Primary Overlay 1": "rgba(154, 69, 35, 0.05)", "Primary Overlay 2": "rgba(154, 69, 35, 0.08)", "Primary Overlay 3": "rgba(154, 69, 35, 0.11)", + "Outline Variant": "#D8C2BB", + "On Error": "#FFFFFF", + "Surface Container Low": "#FEF1ED", + "Surface Container Highest": "#EDE0DC", + "Disabled Container 2": "rgba(32, 26, 24, 0.04)", + "Error Overlay 1": "rgba(186, 26, 26, 0.08)", + "Error Overlay 2": "rgba(186, 26, 26, 0.12)", + "Dark Overlay 3": "rgba(44, 22, 13, 0.16)", + "On Error Container": "#410002", + "Surface Container": "#F8EBE7", + "Inverse Surface": "#362F2C", + "Inverse On Surface": "#FBEEEA", + "On Surface Variant Overlay 1": "rgba(83,67,62, 0.08)", + "On Surface Variant Overlay 2": "rgba(83,67,62, 0.12)", + "Inverse On Surface Overlay 1": "rgba(32,26,24, 0.08)", + "Inverse On Surface Overlay 2": "rgba(32,26,24, 0.12)", + "Surface Container High": "#F7E4DF", }, }, } diff --git a/docs/guides/modules/theme.rst b/docs/guides/modules/theme.rst index a6ff0669..8756e4cb 100644 --- a/docs/guides/modules/theme.rst +++ b/docs/guides/modules/theme.rst @@ -2,7 +2,7 @@ Theme ===== Define color schemes for your app and switch between them easily. -The module includes the definition of the anvil standard Material Design color schemes and those are used as the default. You can also define your own color schemes and use them in the same way. +The module includes the definition of the anvil M3 (beta) color schemes and those are used as the default. You can also define your own color schemes and use them in the same way. Examples -------- @@ -14,7 +14,7 @@ Create an instance of the `theme.Colors` class: colors = theme.Colors() -By default, that instance will have a `schemes` attribute that contains the standard Material Design color schemes. +By default, that instance will have a `schemes` attribute that contains the M3 (beta) color schemes. You can use the instance to set the color scheme of your app to either the 'light' or 'dark' variant of one of those standard schemes. @@ -53,7 +53,7 @@ If you want to set both the scheme and variant at the same time, you can use the colors.set_scheme("Material", "dark") You can define your own color schemes and use them in the same way. For a material -design scheme, follow the `Creating a custom Material Design 3 color scheme `_ docs. +design scheme, follow the `Creating an Material Design 3 color scheme `_ docs. .. code-block:: python