Add colour profiles
An application lists named schemes in livewire-material.profiles, and material:scheme without a seed generates them all into one stylesheet: the default profile as the plain blocks, every profile under <html data-scheme>, with descendant selectors so a nested data-theme panel keeps the page's profile. The JSON keeps the 1.0 top level. Scheme::resolveProfileUsing() lets the application name the active profile; it is asked on every use and falls back to the default for an unknown name or a resolver that throws. The head script writes it before the first paint and keeps it through wire:navigate, and the mail theme and the error pages' fallback draw it. <x-scheme-picker> chooses one and previews it through $store.theme.previewScheme(); the showcase previews the Workbench's profiles. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
This commit is contained in:
Andreas Reinhold / reini
co-authored by
Claude Opus 5
Claude Opus 5
parent
7798352cfc
commit
fb42f004b1
@@ -23,6 +23,23 @@ class WorkbenchServiceProvider extends ServiceProvider
|
||||
'workbench/resources/js/app.js',
|
||||
]]);
|
||||
|
||||
// Three colour profiles, generated into workbench/resources/css/material-scheme.css with
|
||||
// `vendor/bin/testbench material:scheme --output=workbench/resources/css/material-scheme.css`.
|
||||
// Baseline is the package's own default, so the stylesheet draws it as before; the showcase
|
||||
// offers the others. Tests start without profiles and point at the file when they need it.
|
||||
config([
|
||||
'livewire-material.profiles' => [
|
||||
'baseline' => ['label' => 'Baseline', 'seed' => '#6750a4', 'variant' => 'tonal-spot'],
|
||||
'teal' => ['label' => 'Teal', 'seed' => '#00897b', 'variant' => 'vibrant'],
|
||||
'rose' => ['label' => 'Rose', 'seed' => '#c2185b', 'variant' => 'vibrant'],
|
||||
],
|
||||
'livewire-material.profile' => 'baseline',
|
||||
]);
|
||||
|
||||
if (! $this->app->runningUnitTests()) {
|
||||
config(['livewire-material.scheme' => workbench_path('resources/css/material-scheme.json')]);
|
||||
}
|
||||
|
||||
Vite::useHotFile(workbench_path('public/hot'));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
sources so the plans in docs/ are not scanned for class names. */
|
||||
@import 'tailwindcss' source(none);
|
||||
@import '../../../resources/css/material.css';
|
||||
@import './material-scheme.css';
|
||||
|
||||
@source '../../../resources/views';
|
||||
@source '../../../src';
|
||||
|
||||
@@ -0,0 +1,586 @@
|
||||
/*
|
||||
* Material 3 colour profiles, generated by Google's material-color-utilities (spec 2025).
|
||||
*
|
||||
* php artisan material:scheme
|
||||
*
|
||||
* From livewire-material.profiles. "baseline" is the default, and also stands without a
|
||||
* data-scheme attribute:
|
||||
*
|
||||
* baseline #6750a4, tonal-spot
|
||||
* teal #00897b, vibrant
|
||||
* rose #c2185b, vibrant
|
||||
*
|
||||
* Regenerate rather than editing a value: every pair here (a role and its on-role) carries
|
||||
* M3's contrast guarantee only as generated. The head script sets data-theme and data-scheme
|
||||
* before the first paint.
|
||||
*/
|
||||
|
||||
:root,
|
||||
[data-theme='light'] {
|
||||
color-scheme: light;
|
||||
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #34313a;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #34313a;
|
||||
--md-sys-color-on-surface-variant: #615d68;
|
||||
--md-sys-color-outline: #7d7983;
|
||||
--md-sys-color-outline-variant: #b5b0bb;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #a09ba1;
|
||||
--md-sys-color-primary: #655789;
|
||||
--md-sys-color-primary-dim: #594b7c;
|
||||
--md-sys-color-on-primary: #fdf7ff;
|
||||
--md-sys-color-primary-container: #d4c3fd;
|
||||
--md-sys-color-on-primary-container: #493c6c;
|
||||
--md-sys-color-primary-fixed: #d4c3fd;
|
||||
--md-sys-color-primary-fixed-dim: #c6b6ee;
|
||||
--md-sys-color-on-primary-fixed: #352857;
|
||||
--md-sys-color-on-primary-fixed-variant: #524576;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #625c71;
|
||||
--md-sys-color-secondary-dim: #565065;
|
||||
--md-sys-color-on-secondary: #fdf7ff;
|
||||
--md-sys-color-secondary-container: #e8def8;
|
||||
--md-sys-color-on-secondary-container: #554f63;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #7b5270;
|
||||
--md-sys-color-tertiary-dim: #6e4664;
|
||||
--md-sys-color-on-tertiary: #fff7f9;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #a8364b;
|
||||
--md-sys-color-error-dim: #6b0221;
|
||||
--md-sys-color-on-error: #fff7f7;
|
||||
--md-sys-color-error-container: #f97386;
|
||||
--md-sys-color-on-error-container: #6e0523;
|
||||
--md-sys-color-success: #006c45;
|
||||
--md-sys-color-on-success: #ffffff;
|
||||
--md-sys-color-success-container: #86f9bc;
|
||||
--md-sys-color-on-success-container: #002112;
|
||||
--md-sys-color-warning: #7c5800;
|
||||
--md-sys-color-on-warning: #ffffff;
|
||||
--md-sys-color-warning-container: #ffdea6;
|
||||
--md-sys-color-on-warning-container: #271900;
|
||||
--md-sys-color-info: #005ac4;
|
||||
--md-sys-color-on-info: #ffffff;
|
||||
--md-sys-color-info-container: #d8e2ff;
|
||||
--md-sys-color-on-info-container: #001a42;
|
||||
--md-sys-color-inverse-error: #f97386;
|
||||
--md-sys-color-inverse-success: #69dca1;
|
||||
--md-sys-color-inverse-warning: #fdbb28;
|
||||
--md-sys-color-inverse-info: #aec6ff;
|
||||
}
|
||||
|
||||
[data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #eae3ef;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #eae3ef;
|
||||
--md-sys-color-on-surface-variant: #aea9b4;
|
||||
--md-sys-color-outline: #78737e;
|
||||
--md-sys-color-outline-variant: #4a4650;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #575459;
|
||||
--md-sys-color-primary: #cdc0ec;
|
||||
--md-sys-color-primary-dim: #bfb2de;
|
||||
--md-sys-color-on-primary: #443a5f;
|
||||
--md-sys-color-primary-container: #574d72;
|
||||
--md-sys-color-on-primary-container: #e9deff;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #3c3256;
|
||||
--md-sys-color-on-primary-fixed-variant: #594e74;
|
||||
--md-sys-color-inverse-primary: #645980;
|
||||
--md-sys-color-secondary: #cbc2db;
|
||||
--md-sys-color-secondary-dim: #beb5cd;
|
||||
--md-sys-color-on-secondary: #433d51;
|
||||
--md-sys-color-secondary-container: #3e384c;
|
||||
--md-sys-color-on-secondary-container: #c4bbd4;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #ffcfef;
|
||||
--md-sys-color-tertiary-dim: #f4bfe3;
|
||||
--md-sys-color-on-tertiary: #69415f;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #f97386;
|
||||
--md-sys-color-error-dim: #c44b5f;
|
||||
--md-sys-color-on-error: #490013;
|
||||
--md-sys-color-error-container: #871c34;
|
||||
--md-sys-color-on-error-container: #ff97a3;
|
||||
--md-sys-color-success: #69dca1;
|
||||
--md-sys-color-on-success: #003822;
|
||||
--md-sys-color-success-container: #005233;
|
||||
--md-sys-color-on-success-container: #86f9bc;
|
||||
--md-sys-color-warning: #fdbb28;
|
||||
--md-sys-color-on-warning: #412d00;
|
||||
--md-sys-color-warning-container: #5e4200;
|
||||
--md-sys-color-on-warning-container: #ffdea6;
|
||||
--md-sys-color-info: #aec6ff;
|
||||
--md-sys-color-on-info: #002e6a;
|
||||
--md-sys-color-info-container: #004396;
|
||||
--md-sys-color-on-info-container: #d8e2ff;
|
||||
--md-sys-color-inverse-error: #a8364b;
|
||||
--md-sys-color-inverse-success: #006c45;
|
||||
--md-sys-color-inverse-warning: #7c5800;
|
||||
--md-sys-color-inverse-info: #005ac4;
|
||||
}
|
||||
|
||||
[data-scheme='baseline'],
|
||||
[data-scheme='baseline'][data-theme='light'],
|
||||
[data-scheme='baseline'] [data-theme='light'] {
|
||||
color-scheme: light;
|
||||
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #34313a;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #34313a;
|
||||
--md-sys-color-on-surface-variant: #615d68;
|
||||
--md-sys-color-outline: #7d7983;
|
||||
--md-sys-color-outline-variant: #b5b0bb;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #a09ba1;
|
||||
--md-sys-color-primary: #655789;
|
||||
--md-sys-color-primary-dim: #594b7c;
|
||||
--md-sys-color-on-primary: #fdf7ff;
|
||||
--md-sys-color-primary-container: #d4c3fd;
|
||||
--md-sys-color-on-primary-container: #493c6c;
|
||||
--md-sys-color-primary-fixed: #d4c3fd;
|
||||
--md-sys-color-primary-fixed-dim: #c6b6ee;
|
||||
--md-sys-color-on-primary-fixed: #352857;
|
||||
--md-sys-color-on-primary-fixed-variant: #524576;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #625c71;
|
||||
--md-sys-color-secondary-dim: #565065;
|
||||
--md-sys-color-on-secondary: #fdf7ff;
|
||||
--md-sys-color-secondary-container: #e8def8;
|
||||
--md-sys-color-on-secondary-container: #554f63;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #7b5270;
|
||||
--md-sys-color-tertiary-dim: #6e4664;
|
||||
--md-sys-color-on-tertiary: #fff7f9;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #a8364b;
|
||||
--md-sys-color-error-dim: #6b0221;
|
||||
--md-sys-color-on-error: #fff7f7;
|
||||
--md-sys-color-error-container: #f97386;
|
||||
--md-sys-color-on-error-container: #6e0523;
|
||||
--md-sys-color-success: #006c45;
|
||||
--md-sys-color-on-success: #ffffff;
|
||||
--md-sys-color-success-container: #86f9bc;
|
||||
--md-sys-color-on-success-container: #002112;
|
||||
--md-sys-color-warning: #7c5800;
|
||||
--md-sys-color-on-warning: #ffffff;
|
||||
--md-sys-color-warning-container: #ffdea6;
|
||||
--md-sys-color-on-warning-container: #271900;
|
||||
--md-sys-color-info: #005ac4;
|
||||
--md-sys-color-on-info: #ffffff;
|
||||
--md-sys-color-info-container: #d8e2ff;
|
||||
--md-sys-color-on-info-container: #001a42;
|
||||
--md-sys-color-inverse-error: #f97386;
|
||||
--md-sys-color-inverse-success: #69dca1;
|
||||
--md-sys-color-inverse-warning: #fdbb28;
|
||||
--md-sys-color-inverse-info: #aec6ff;
|
||||
}
|
||||
|
||||
[data-scheme='baseline'][data-theme='dark'],
|
||||
[data-scheme='baseline'] [data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #eae3ef;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #eae3ef;
|
||||
--md-sys-color-on-surface-variant: #aea9b4;
|
||||
--md-sys-color-outline: #78737e;
|
||||
--md-sys-color-outline-variant: #4a4650;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #575459;
|
||||
--md-sys-color-primary: #cdc0ec;
|
||||
--md-sys-color-primary-dim: #bfb2de;
|
||||
--md-sys-color-on-primary: #443a5f;
|
||||
--md-sys-color-primary-container: #574d72;
|
||||
--md-sys-color-on-primary-container: #e9deff;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #3c3256;
|
||||
--md-sys-color-on-primary-fixed-variant: #594e74;
|
||||
--md-sys-color-inverse-primary: #645980;
|
||||
--md-sys-color-secondary: #cbc2db;
|
||||
--md-sys-color-secondary-dim: #beb5cd;
|
||||
--md-sys-color-on-secondary: #433d51;
|
||||
--md-sys-color-secondary-container: #3e384c;
|
||||
--md-sys-color-on-secondary-container: #c4bbd4;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #ffcfef;
|
||||
--md-sys-color-tertiary-dim: #f4bfe3;
|
||||
--md-sys-color-on-tertiary: #69415f;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #f97386;
|
||||
--md-sys-color-error-dim: #c44b5f;
|
||||
--md-sys-color-on-error: #490013;
|
||||
--md-sys-color-error-container: #871c34;
|
||||
--md-sys-color-on-error-container: #ff97a3;
|
||||
--md-sys-color-success: #69dca1;
|
||||
--md-sys-color-on-success: #003822;
|
||||
--md-sys-color-success-container: #005233;
|
||||
--md-sys-color-on-success-container: #86f9bc;
|
||||
--md-sys-color-warning: #fdbb28;
|
||||
--md-sys-color-on-warning: #412d00;
|
||||
--md-sys-color-warning-container: #5e4200;
|
||||
--md-sys-color-on-warning-container: #ffdea6;
|
||||
--md-sys-color-info: #aec6ff;
|
||||
--md-sys-color-on-info: #002e6a;
|
||||
--md-sys-color-info-container: #004396;
|
||||
--md-sys-color-on-info-container: #d8e2ff;
|
||||
--md-sys-color-inverse-error: #a8364b;
|
||||
--md-sys-color-inverse-success: #006c45;
|
||||
--md-sys-color-inverse-warning: #7c5800;
|
||||
--md-sys-color-inverse-info: #005ac4;
|
||||
}
|
||||
|
||||
[data-scheme='teal'],
|
||||
[data-scheme='teal'][data-theme='light'],
|
||||
[data-scheme='teal'] [data-theme='light'] {
|
||||
color-scheme: light;
|
||||
|
||||
--md-sys-color-background: #d3fffd;
|
||||
--md-sys-color-on-background: #003534;
|
||||
--md-sys-color-surface: #d3fffd;
|
||||
--md-sys-color-surface-dim: #87e4e1;
|
||||
--md-sys-color-surface-bright: #d3fffd;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #bafdfa;
|
||||
--md-sys-color-surface-container: #adf5f2;
|
||||
--md-sys-color-surface-container-high: #a2f0ed;
|
||||
--md-sys-color-surface-container-highest: #96ece8;
|
||||
--md-sys-color-on-surface: #003534;
|
||||
--md-sys-color-on-surface-variant: #296463;
|
||||
--md-sys-color-outline: #46807e;
|
||||
--md-sys-color-outline-variant: #7db7b5;
|
||||
--md-sys-color-inverse-surface: #001111;
|
||||
--md-sys-color-inverse-on-surface: #6da7a5;
|
||||
--md-sys-color-primary: #00675c;
|
||||
--md-sys-color-primary-dim: #005a50;
|
||||
--md-sys-color-on-primary: #c0fff3;
|
||||
--md-sys-color-primary-container: #00f7df;
|
||||
--md-sys-color-on-primary-container: #00594f;
|
||||
--md-sys-color-primary-fixed: #00f7df;
|
||||
--md-sys-color-primary-fixed-dim: #00e8d1;
|
||||
--md-sys-color-on-primary-fixed: #00443c;
|
||||
--md-sys-color-on-primary-fixed-variant: #006359;
|
||||
--md-sys-color-inverse-primary: #00fee5;
|
||||
--md-sys-color-secondary: #006765;
|
||||
--md-sys-color-secondary-dim: #005958;
|
||||
--md-sys-color-on-secondary: #bcfffc;
|
||||
--md-sys-color-secondary-container: #38fbf7;
|
||||
--md-sys-color-on-secondary-container: #005c5a;
|
||||
--md-sys-color-secondary-fixed: #38fbf7;
|
||||
--md-sys-color-secondary-fixed-dim: #10ece8;
|
||||
--md-sys-color-on-secondary-fixed: #004746;
|
||||
--md-sys-color-on-secondary-fixed-variant: #006765;
|
||||
--md-sys-color-tertiary: #006386;
|
||||
--md-sys-color-tertiary-dim: #005675;
|
||||
--md-sys-color-on-tertiary: #e7f5ff;
|
||||
--md-sys-color-tertiary-container: #20c0ff;
|
||||
--md-sys-color-on-tertiary-container: #00374d;
|
||||
--md-sys-color-tertiary-fixed: #20c0ff;
|
||||
--md-sys-color-tertiary-fixed-dim: #00b2ee;
|
||||
--md-sys-color-on-tertiary-fixed: #001e2b;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #004059;
|
||||
--md-sys-color-error: #b31b25;
|
||||
--md-sys-color-error-dim: #9f0519;
|
||||
--md-sys-color-on-error: #ffefee;
|
||||
--md-sys-color-error-container: #fb5151;
|
||||
--md-sys-color-on-error-container: #570008;
|
||||
--md-sys-color-success: #006c45;
|
||||
--md-sys-color-on-success: #ffffff;
|
||||
--md-sys-color-success-container: #86f9bc;
|
||||
--md-sys-color-on-success-container: #002112;
|
||||
--md-sys-color-warning: #7c5800;
|
||||
--md-sys-color-on-warning: #ffffff;
|
||||
--md-sys-color-warning-container: #ffdea6;
|
||||
--md-sys-color-on-warning-container: #271900;
|
||||
--md-sys-color-info: #005ac4;
|
||||
--md-sys-color-on-info: #ffffff;
|
||||
--md-sys-color-info-container: #d8e2ff;
|
||||
--md-sys-color-on-info-container: #001a42;
|
||||
--md-sys-color-inverse-error: #ff716c;
|
||||
--md-sys-color-inverse-success: #69dca1;
|
||||
--md-sys-color-inverse-warning: #fdbb28;
|
||||
--md-sys-color-inverse-info: #aec6ff;
|
||||
}
|
||||
|
||||
[data-scheme='teal'][data-theme='dark'],
|
||||
[data-scheme='teal'] [data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
|
||||
--md-sys-color-background: #001111;
|
||||
--md-sys-color-on-background: #b8f3f1;
|
||||
--md-sys-color-surface: #001111;
|
||||
--md-sys-color-surface-dim: #001111;
|
||||
--md-sys-color-surface-bright: #003231;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #001716;
|
||||
--md-sys-color-surface-container: #001e1d;
|
||||
--md-sys-color-surface-container-high: #002424;
|
||||
--md-sys-color-surface-container-highest: #002b2a;
|
||||
--md-sys-color-on-surface: #b8f3f1;
|
||||
--md-sys-color-on-surface-variant: #7bb5b3;
|
||||
--md-sys-color-outline: #457f7d;
|
||||
--md-sys-color-outline-variant: #0e504f;
|
||||
--md-sys-color-inverse-surface: #e3fffd;
|
||||
--md-sys-color-inverse-on-surface: #215e5c;
|
||||
--md-sys-color-primary: #b4fff1;
|
||||
--md-sys-color-primary-dim: #00fee5;
|
||||
--md-sys-color-on-primary: #00665b;
|
||||
--md-sys-color-primary-container: #00fee5;
|
||||
--md-sys-color-on-primary-container: #005c53;
|
||||
--md-sys-color-primary-fixed: #00f7df;
|
||||
--md-sys-color-primary-fixed-dim: #00e8d1;
|
||||
--md-sys-color-on-primary-fixed: #00443c;
|
||||
--md-sys-color-on-primary-fixed-variant: #006359;
|
||||
--md-sys-color-inverse-primary: #006b60;
|
||||
--md-sys-color-secondary: #38fbf7;
|
||||
--md-sys-color-secondary-dim: #10ece8;
|
||||
--md-sys-color-on-secondary: #005c5a;
|
||||
--md-sys-color-secondary-container: #006a68;
|
||||
--md-sys-color-on-secondary-container: #dafffd;
|
||||
--md-sys-color-secondary-fixed: #38fbf7;
|
||||
--md-sys-color-secondary-fixed-dim: #10ece8;
|
||||
--md-sys-color-on-secondary-fixed: #004746;
|
||||
--md-sys-color-on-secondary-fixed-variant: #006765;
|
||||
--md-sys-color-tertiary: #68ccff;
|
||||
--md-sys-color-tertiary-dim: #20c0ff;
|
||||
--md-sys-color-on-tertiary: #00415a;
|
||||
--md-sys-color-tertiary-container: #20c0ff;
|
||||
--md-sys-color-on-tertiary-container: #00374d;
|
||||
--md-sys-color-tertiary-fixed: #20c0ff;
|
||||
--md-sys-color-tertiary-fixed-dim: #00b2ee;
|
||||
--md-sys-color-on-tertiary-fixed: #001e2b;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #004059;
|
||||
--md-sys-color-error: #ff716c;
|
||||
--md-sys-color-error-dim: #d7383b;
|
||||
--md-sys-color-on-error: #490006;
|
||||
--md-sys-color-error-container: #9f0519;
|
||||
--md-sys-color-on-error-container: #ffa8a3;
|
||||
--md-sys-color-success: #69dca1;
|
||||
--md-sys-color-on-success: #003822;
|
||||
--md-sys-color-success-container: #005233;
|
||||
--md-sys-color-on-success-container: #86f9bc;
|
||||
--md-sys-color-warning: #fdbb28;
|
||||
--md-sys-color-on-warning: #412d00;
|
||||
--md-sys-color-warning-container: #5e4200;
|
||||
--md-sys-color-on-warning-container: #ffdea6;
|
||||
--md-sys-color-info: #aec6ff;
|
||||
--md-sys-color-on-info: #002e6a;
|
||||
--md-sys-color-info-container: #004396;
|
||||
--md-sys-color-on-info-container: #d8e2ff;
|
||||
--md-sys-color-inverse-error: #b31b25;
|
||||
--md-sys-color-inverse-success: #006c45;
|
||||
--md-sys-color-inverse-warning: #7c5800;
|
||||
--md-sys-color-inverse-info: #005ac4;
|
||||
}
|
||||
|
||||
[data-scheme='rose'],
|
||||
[data-scheme='rose'][data-theme='light'],
|
||||
[data-scheme='rose'] [data-theme='light'] {
|
||||
color-scheme: light;
|
||||
|
||||
--md-sys-color-background: #fff4f6;
|
||||
--md-sys-color-on-background: #492136;
|
||||
--md-sys-color-surface: #fff4f6;
|
||||
--md-sys-color-surface-dim: #ffc4de;
|
||||
--md-sys-color-surface-bright: #fff4f6;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #ffecf2;
|
||||
--md-sys-color-surface-container: #ffe0ec;
|
||||
--md-sys-color-surface-container-high: #ffd8e8;
|
||||
--md-sys-color-surface-container-highest: #ffd0e4;
|
||||
--md-sys-color-on-surface: #492136;
|
||||
--md-sys-color-on-surface-variant: #7c4d64;
|
||||
--md-sys-color-outline: #9b6880;
|
||||
--md-sys-color-outline-variant: #d69db7;
|
||||
--md-sys-color-inverse-surface: #220215;
|
||||
--md-sys-color-inverse-on-surface: #c58da6;
|
||||
--md-sys-color-primary: #ae1d53;
|
||||
--md-sys-color-primary-dim: #9e0b47;
|
||||
--md-sys-color-on-primary: #ffeff0;
|
||||
--md-sys-color-primary-container: #ff7198;
|
||||
--md-sys-color-on-primary-container: #4d001e;
|
||||
--md-sys-color-primary-fixed: #ff7198;
|
||||
--md-sys-color-primary-fixed-dim: #f95a8a;
|
||||
--md-sys-color-on-primary-fixed: #000000;
|
||||
--md-sys-color-on-primary-fixed-variant: #5e0027;
|
||||
--md-sys-color-inverse-primary: #f65787;
|
||||
--md-sys-color-secondary: #99366e;
|
||||
--md-sys-color-secondary-dim: #8a2a62;
|
||||
--md-sys-color-on-secondary: #ffeff3;
|
||||
--md-sys-color-secondary-container: #ffc0dc;
|
||||
--md-sys-color-on-secondary-container: #7f2159;
|
||||
--md-sys-color-secondary-fixed: #ffc0dc;
|
||||
--md-sys-color-secondary-fixed-dim: #ffabd2;
|
||||
--md-sys-color-on-secondary-fixed: #670845;
|
||||
--md-sys-color-on-secondary-fixed-variant: #8b2b63;
|
||||
--md-sys-color-tertiary: #5c4bb4;
|
||||
--md-sys-color-tertiary-dim: #503ea7;
|
||||
--md-sys-color-on-tertiary: #f6f0ff;
|
||||
--md-sys-color-tertiary-container: #b3a5ff;
|
||||
--md-sys-color-on-tertiary-container: #301887;
|
||||
--md-sys-color-tertiary-fixed: #b3a5ff;
|
||||
--md-sys-color-tertiary-fixed-dim: #a595ff;
|
||||
--md-sys-color-on-tertiary-fixed: #170059;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #39248f;
|
||||
--md-sys-color-error: #b31b25;
|
||||
--md-sys-color-error-dim: #9f0519;
|
||||
--md-sys-color-on-error: #ffefee;
|
||||
--md-sys-color-error-container: #fb5151;
|
||||
--md-sys-color-on-error-container: #570008;
|
||||
--md-sys-color-success: #006c45;
|
||||
--md-sys-color-on-success: #ffffff;
|
||||
--md-sys-color-success-container: #86f9bc;
|
||||
--md-sys-color-on-success-container: #002112;
|
||||
--md-sys-color-warning: #7c5800;
|
||||
--md-sys-color-on-warning: #ffffff;
|
||||
--md-sys-color-warning-container: #ffdea6;
|
||||
--md-sys-color-on-warning-container: #271900;
|
||||
--md-sys-color-info: #005ac4;
|
||||
--md-sys-color-on-info: #ffffff;
|
||||
--md-sys-color-info-container: #d8e2ff;
|
||||
--md-sys-color-on-info-container: #001a42;
|
||||
--md-sys-color-inverse-error: #ff716c;
|
||||
--md-sys-color-inverse-success: #69dca1;
|
||||
--md-sys-color-inverse-warning: #fdbb28;
|
||||
--md-sys-color-inverse-info: #aec6ff;
|
||||
}
|
||||
|
||||
[data-scheme='rose'][data-theme='dark'],
|
||||
[data-scheme='rose'] [data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
|
||||
--md-sys-color-background: #220215;
|
||||
--md-sys-color-on-background: #ffdcea;
|
||||
--md-sys-color-surface: #220215;
|
||||
--md-sys-color-surface-dim: #220215;
|
||||
--md-sys-color-surface-bright: #4e1737;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #2a041b;
|
||||
--md-sys-color-surface-container: #330822;
|
||||
--md-sys-color-surface-container-high: #3c0d28;
|
||||
--md-sys-color-surface-container-highest: #45122f;
|
||||
--md-sys-color-on-surface: #ffdcea;
|
||||
--md-sys-color-on-surface-variant: #d49bb4;
|
||||
--md-sys-color-outline: #99667e;
|
||||
--md-sys-color-outline-variant: #663a50;
|
||||
--md-sys-color-inverse-surface: #fff8f8;
|
||||
--md-sys-color-inverse-on-surface: #75475d;
|
||||
--md-sys-color-primary: #ff8aa7;
|
||||
--md-sys-color-primary-dim: #ff6b95;
|
||||
--md-sys-color-on-primary: #620029;
|
||||
--md-sys-color-primary-container: #ff7198;
|
||||
--md-sys-color-on-primary-container: #4d001e;
|
||||
--md-sys-color-primary-fixed: #ff7198;
|
||||
--md-sys-color-primary-fixed-dim: #f95a8a;
|
||||
--md-sys-color-on-primary-fixed: #000000;
|
||||
--md-sys-color-on-primary-fixed-variant: #5e0027;
|
||||
--md-sys-color-inverse-primary: #b32257;
|
||||
--md-sys-color-secondary: #ff8ac6;
|
||||
--md-sys-color-secondary-dim: #ef7db9;
|
||||
--md-sys-color-on-secondary: #620241;
|
||||
--md-sys-color-secondary-container: #7f2058;
|
||||
--md-sys-color-on-secondary-container: #ffbedb;
|
||||
--md-sys-color-secondary-fixed: #ffc0dc;
|
||||
--md-sys-color-secondary-fixed-dim: #ffabd2;
|
||||
--md-sys-color-on-secondary-fixed: #670845;
|
||||
--md-sys-color-on-secondary-fixed-variant: #8b2b63;
|
||||
--md-sys-color-tertiary: #aa9bff;
|
||||
--md-sys-color-tertiary-dim: #9f8ffc;
|
||||
--md-sys-color-on-tertiary: #290c80;
|
||||
--md-sys-color-tertiary-container: #9d8cfa;
|
||||
--md-sys-color-on-tertiary-container: #1c0068;
|
||||
--md-sys-color-tertiary-fixed: #b3a5ff;
|
||||
--md-sys-color-tertiary-fixed-dim: #a595ff;
|
||||
--md-sys-color-on-tertiary-fixed: #170059;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #39248f;
|
||||
--md-sys-color-error: #ff716c;
|
||||
--md-sys-color-error-dim: #d7383b;
|
||||
--md-sys-color-on-error: #490006;
|
||||
--md-sys-color-error-container: #9f0519;
|
||||
--md-sys-color-on-error-container: #ffa8a3;
|
||||
--md-sys-color-success: #69dca1;
|
||||
--md-sys-color-on-success: #003822;
|
||||
--md-sys-color-success-container: #005233;
|
||||
--md-sys-color-on-success-container: #86f9bc;
|
||||
--md-sys-color-warning: #fdbb28;
|
||||
--md-sys-color-on-warning: #412d00;
|
||||
--md-sys-color-warning-container: #5e4200;
|
||||
--md-sys-color-on-warning-container: #ffdea6;
|
||||
--md-sys-color-info: #aec6ff;
|
||||
--md-sys-color-on-info: #002e6a;
|
||||
--md-sys-color-info-container: #004396;
|
||||
--md-sys-color-on-info-container: #d8e2ff;
|
||||
--md-sys-color-inverse-error: #b31b25;
|
||||
--md-sys-color-inverse-success: #006c45;
|
||||
--md-sys-color-inverse-warning: #7c5800;
|
||||
--md-sys-color-inverse-info: #005ac4;
|
||||
}
|
||||
@@ -0,0 +1,566 @@
|
||||
{
|
||||
"seed": "#6750a4",
|
||||
"variant": "tonal-spot",
|
||||
"spec": "2025",
|
||||
"contrast": 0,
|
||||
"light": {
|
||||
"background": "#fdf7fe",
|
||||
"on-background": "#34313a",
|
||||
"surface": "#fdf7fe",
|
||||
"surface-dim": "#ded8e4",
|
||||
"surface-bright": "#fdf7fe",
|
||||
"surface-container-lowest": "#ffffff",
|
||||
"surface-container-low": "#f8f1fa",
|
||||
"surface-container": "#f2ecf5",
|
||||
"surface-container-high": "#ece6f0",
|
||||
"surface-container-highest": "#e7e0ec",
|
||||
"on-surface": "#34313a",
|
||||
"on-surface-variant": "#615d68",
|
||||
"outline": "#7d7983",
|
||||
"outline-variant": "#b5b0bb",
|
||||
"inverse-surface": "#0f0d12",
|
||||
"inverse-on-surface": "#a09ba1",
|
||||
"primary": "#655789",
|
||||
"primary-dim": "#594b7c",
|
||||
"on-primary": "#fdf7ff",
|
||||
"primary-container": "#d4c3fd",
|
||||
"on-primary-container": "#493c6c",
|
||||
"primary-fixed": "#d4c3fd",
|
||||
"primary-fixed-dim": "#c6b6ee",
|
||||
"on-primary-fixed": "#352857",
|
||||
"on-primary-fixed-variant": "#524576",
|
||||
"inverse-primary": "#d4c3fd",
|
||||
"secondary": "#625c71",
|
||||
"secondary-dim": "#565065",
|
||||
"on-secondary": "#fdf7ff",
|
||||
"secondary-container": "#e8def8",
|
||||
"on-secondary-container": "#554f63",
|
||||
"secondary-fixed": "#e8def8",
|
||||
"secondary-fixed-dim": "#dad0ea",
|
||||
"on-secondary-fixed": "#423c50",
|
||||
"on-secondary-fixed-variant": "#5f586e",
|
||||
"tertiary": "#7b5270",
|
||||
"tertiary-dim": "#6e4664",
|
||||
"on-tertiary": "#fff7f9",
|
||||
"tertiary-container": "#f4bfe3",
|
||||
"on-tertiary-container": "#5f3956",
|
||||
"tertiary-fixed": "#f4bfe3",
|
||||
"tertiary-fixed-dim": "#e5b2d5",
|
||||
"on-tertiary-fixed": "#4a2642",
|
||||
"on-tertiary-fixed-variant": "#694260",
|
||||
"error": "#a8364b",
|
||||
"error-dim": "#6b0221",
|
||||
"on-error": "#fff7f7",
|
||||
"error-container": "#f97386",
|
||||
"on-error-container": "#6e0523",
|
||||
"success": "#006c45",
|
||||
"on-success": "#ffffff",
|
||||
"success-container": "#86f9bc",
|
||||
"on-success-container": "#002112",
|
||||
"warning": "#7c5800",
|
||||
"on-warning": "#ffffff",
|
||||
"warning-container": "#ffdea6",
|
||||
"on-warning-container": "#271900",
|
||||
"info": "#005ac4",
|
||||
"on-info": "#ffffff",
|
||||
"info-container": "#d8e2ff",
|
||||
"on-info-container": "#001a42",
|
||||
"inverse-error": "#f97386",
|
||||
"inverse-success": "#69dca1",
|
||||
"inverse-warning": "#fdbb28",
|
||||
"inverse-info": "#aec6ff"
|
||||
},
|
||||
"dark": {
|
||||
"background": "#0f0d12",
|
||||
"on-background": "#eae3ef",
|
||||
"surface": "#0f0d12",
|
||||
"surface-dim": "#0f0d12",
|
||||
"surface-bright": "#2e2b34",
|
||||
"surface-container-lowest": "#000000",
|
||||
"surface-container-low": "#141218",
|
||||
"surface-container": "#1b181f",
|
||||
"surface-container-high": "#211e26",
|
||||
"surface-container-highest": "#27242d",
|
||||
"on-surface": "#eae3ef",
|
||||
"on-surface-variant": "#aea9b4",
|
||||
"outline": "#78737e",
|
||||
"outline-variant": "#4a4650",
|
||||
"inverse-surface": "#fdf7fe",
|
||||
"inverse-on-surface": "#575459",
|
||||
"primary": "#cdc0ec",
|
||||
"primary-dim": "#bfb2de",
|
||||
"on-primary": "#443a5f",
|
||||
"primary-container": "#574d72",
|
||||
"on-primary-container": "#e9deff",
|
||||
"primary-fixed": "#ded0fe",
|
||||
"primary-fixed-dim": "#d0c3ef",
|
||||
"on-primary-fixed": "#3c3256",
|
||||
"on-primary-fixed-variant": "#594e74",
|
||||
"inverse-primary": "#645980",
|
||||
"secondary": "#cbc2db",
|
||||
"secondary-dim": "#beb5cd",
|
||||
"on-secondary": "#433d51",
|
||||
"secondary-container": "#3e384c",
|
||||
"on-secondary-container": "#c4bbd4",
|
||||
"secondary-fixed": "#e8def8",
|
||||
"secondary-fixed-dim": "#dad0ea",
|
||||
"on-secondary-fixed": "#423c50",
|
||||
"on-secondary-fixed-variant": "#5f586e",
|
||||
"tertiary": "#ffcfef",
|
||||
"tertiary-dim": "#f4bfe3",
|
||||
"on-tertiary": "#69415f",
|
||||
"tertiary-container": "#f4bfe3",
|
||||
"on-tertiary-container": "#5f3956",
|
||||
"tertiary-fixed": "#f4bfe3",
|
||||
"tertiary-fixed-dim": "#e5b2d5",
|
||||
"on-tertiary-fixed": "#4a2642",
|
||||
"on-tertiary-fixed-variant": "#694260",
|
||||
"error": "#f97386",
|
||||
"error-dim": "#c44b5f",
|
||||
"on-error": "#490013",
|
||||
"error-container": "#871c34",
|
||||
"on-error-container": "#ff97a3",
|
||||
"success": "#69dca1",
|
||||
"on-success": "#003822",
|
||||
"success-container": "#005233",
|
||||
"on-success-container": "#86f9bc",
|
||||
"warning": "#fdbb28",
|
||||
"on-warning": "#412d00",
|
||||
"warning-container": "#5e4200",
|
||||
"on-warning-container": "#ffdea6",
|
||||
"info": "#aec6ff",
|
||||
"on-info": "#002e6a",
|
||||
"info-container": "#004396",
|
||||
"on-info-container": "#d8e2ff",
|
||||
"inverse-error": "#a8364b",
|
||||
"inverse-success": "#006c45",
|
||||
"inverse-warning": "#7c5800",
|
||||
"inverse-info": "#005ac4"
|
||||
},
|
||||
"default": "baseline",
|
||||
"profiles": {
|
||||
"baseline": {
|
||||
"label": "Baseline",
|
||||
"seed": "#6750a4",
|
||||
"variant": "tonal-spot",
|
||||
"spec": "2025",
|
||||
"contrast": 0,
|
||||
"light": {
|
||||
"background": "#fdf7fe",
|
||||
"on-background": "#34313a",
|
||||
"surface": "#fdf7fe",
|
||||
"surface-dim": "#ded8e4",
|
||||
"surface-bright": "#fdf7fe",
|
||||
"surface-container-lowest": "#ffffff",
|
||||
"surface-container-low": "#f8f1fa",
|
||||
"surface-container": "#f2ecf5",
|
||||
"surface-container-high": "#ece6f0",
|
||||
"surface-container-highest": "#e7e0ec",
|
||||
"on-surface": "#34313a",
|
||||
"on-surface-variant": "#615d68",
|
||||
"outline": "#7d7983",
|
||||
"outline-variant": "#b5b0bb",
|
||||
"inverse-surface": "#0f0d12",
|
||||
"inverse-on-surface": "#a09ba1",
|
||||
"primary": "#655789",
|
||||
"primary-dim": "#594b7c",
|
||||
"on-primary": "#fdf7ff",
|
||||
"primary-container": "#d4c3fd",
|
||||
"on-primary-container": "#493c6c",
|
||||
"primary-fixed": "#d4c3fd",
|
||||
"primary-fixed-dim": "#c6b6ee",
|
||||
"on-primary-fixed": "#352857",
|
||||
"on-primary-fixed-variant": "#524576",
|
||||
"inverse-primary": "#d4c3fd",
|
||||
"secondary": "#625c71",
|
||||
"secondary-dim": "#565065",
|
||||
"on-secondary": "#fdf7ff",
|
||||
"secondary-container": "#e8def8",
|
||||
"on-secondary-container": "#554f63",
|
||||
"secondary-fixed": "#e8def8",
|
||||
"secondary-fixed-dim": "#dad0ea",
|
||||
"on-secondary-fixed": "#423c50",
|
||||
"on-secondary-fixed-variant": "#5f586e",
|
||||
"tertiary": "#7b5270",
|
||||
"tertiary-dim": "#6e4664",
|
||||
"on-tertiary": "#fff7f9",
|
||||
"tertiary-container": "#f4bfe3",
|
||||
"on-tertiary-container": "#5f3956",
|
||||
"tertiary-fixed": "#f4bfe3",
|
||||
"tertiary-fixed-dim": "#e5b2d5",
|
||||
"on-tertiary-fixed": "#4a2642",
|
||||
"on-tertiary-fixed-variant": "#694260",
|
||||
"error": "#a8364b",
|
||||
"error-dim": "#6b0221",
|
||||
"on-error": "#fff7f7",
|
||||
"error-container": "#f97386",
|
||||
"on-error-container": "#6e0523",
|
||||
"success": "#006c45",
|
||||
"on-success": "#ffffff",
|
||||
"success-container": "#86f9bc",
|
||||
"on-success-container": "#002112",
|
||||
"warning": "#7c5800",
|
||||
"on-warning": "#ffffff",
|
||||
"warning-container": "#ffdea6",
|
||||
"on-warning-container": "#271900",
|
||||
"info": "#005ac4",
|
||||
"on-info": "#ffffff",
|
||||
"info-container": "#d8e2ff",
|
||||
"on-info-container": "#001a42",
|
||||
"inverse-error": "#f97386",
|
||||
"inverse-success": "#69dca1",
|
||||
"inverse-warning": "#fdbb28",
|
||||
"inverse-info": "#aec6ff"
|
||||
},
|
||||
"dark": {
|
||||
"background": "#0f0d12",
|
||||
"on-background": "#eae3ef",
|
||||
"surface": "#0f0d12",
|
||||
"surface-dim": "#0f0d12",
|
||||
"surface-bright": "#2e2b34",
|
||||
"surface-container-lowest": "#000000",
|
||||
"surface-container-low": "#141218",
|
||||
"surface-container": "#1b181f",
|
||||
"surface-container-high": "#211e26",
|
||||
"surface-container-highest": "#27242d",
|
||||
"on-surface": "#eae3ef",
|
||||
"on-surface-variant": "#aea9b4",
|
||||
"outline": "#78737e",
|
||||
"outline-variant": "#4a4650",
|
||||
"inverse-surface": "#fdf7fe",
|
||||
"inverse-on-surface": "#575459",
|
||||
"primary": "#cdc0ec",
|
||||
"primary-dim": "#bfb2de",
|
||||
"on-primary": "#443a5f",
|
||||
"primary-container": "#574d72",
|
||||
"on-primary-container": "#e9deff",
|
||||
"primary-fixed": "#ded0fe",
|
||||
"primary-fixed-dim": "#d0c3ef",
|
||||
"on-primary-fixed": "#3c3256",
|
||||
"on-primary-fixed-variant": "#594e74",
|
||||
"inverse-primary": "#645980",
|
||||
"secondary": "#cbc2db",
|
||||
"secondary-dim": "#beb5cd",
|
||||
"on-secondary": "#433d51",
|
||||
"secondary-container": "#3e384c",
|
||||
"on-secondary-container": "#c4bbd4",
|
||||
"secondary-fixed": "#e8def8",
|
||||
"secondary-fixed-dim": "#dad0ea",
|
||||
"on-secondary-fixed": "#423c50",
|
||||
"on-secondary-fixed-variant": "#5f586e",
|
||||
"tertiary": "#ffcfef",
|
||||
"tertiary-dim": "#f4bfe3",
|
||||
"on-tertiary": "#69415f",
|
||||
"tertiary-container": "#f4bfe3",
|
||||
"on-tertiary-container": "#5f3956",
|
||||
"tertiary-fixed": "#f4bfe3",
|
||||
"tertiary-fixed-dim": "#e5b2d5",
|
||||
"on-tertiary-fixed": "#4a2642",
|
||||
"on-tertiary-fixed-variant": "#694260",
|
||||
"error": "#f97386",
|
||||
"error-dim": "#c44b5f",
|
||||
"on-error": "#490013",
|
||||
"error-container": "#871c34",
|
||||
"on-error-container": "#ff97a3",
|
||||
"success": "#69dca1",
|
||||
"on-success": "#003822",
|
||||
"success-container": "#005233",
|
||||
"on-success-container": "#86f9bc",
|
||||
"warning": "#fdbb28",
|
||||
"on-warning": "#412d00",
|
||||
"warning-container": "#5e4200",
|
||||
"on-warning-container": "#ffdea6",
|
||||
"info": "#aec6ff",
|
||||
"on-info": "#002e6a",
|
||||
"info-container": "#004396",
|
||||
"on-info-container": "#d8e2ff",
|
||||
"inverse-error": "#a8364b",
|
||||
"inverse-success": "#006c45",
|
||||
"inverse-warning": "#7c5800",
|
||||
"inverse-info": "#005ac4"
|
||||
}
|
||||
},
|
||||
"teal": {
|
||||
"label": "Teal",
|
||||
"seed": "#00897b",
|
||||
"variant": "vibrant",
|
||||
"spec": "2025",
|
||||
"contrast": 0,
|
||||
"light": {
|
||||
"background": "#d3fffd",
|
||||
"on-background": "#003534",
|
||||
"surface": "#d3fffd",
|
||||
"surface-dim": "#87e4e1",
|
||||
"surface-bright": "#d3fffd",
|
||||
"surface-container-lowest": "#ffffff",
|
||||
"surface-container-low": "#bafdfa",
|
||||
"surface-container": "#adf5f2",
|
||||
"surface-container-high": "#a2f0ed",
|
||||
"surface-container-highest": "#96ece8",
|
||||
"on-surface": "#003534",
|
||||
"on-surface-variant": "#296463",
|
||||
"outline": "#46807e",
|
||||
"outline-variant": "#7db7b5",
|
||||
"inverse-surface": "#001111",
|
||||
"inverse-on-surface": "#6da7a5",
|
||||
"primary": "#00675c",
|
||||
"primary-dim": "#005a50",
|
||||
"on-primary": "#c0fff3",
|
||||
"primary-container": "#00f7df",
|
||||
"on-primary-container": "#00594f",
|
||||
"primary-fixed": "#00f7df",
|
||||
"primary-fixed-dim": "#00e8d1",
|
||||
"on-primary-fixed": "#00443c",
|
||||
"on-primary-fixed-variant": "#006359",
|
||||
"inverse-primary": "#00fee5",
|
||||
"secondary": "#006765",
|
||||
"secondary-dim": "#005958",
|
||||
"on-secondary": "#bcfffc",
|
||||
"secondary-container": "#38fbf7",
|
||||
"on-secondary-container": "#005c5a",
|
||||
"secondary-fixed": "#38fbf7",
|
||||
"secondary-fixed-dim": "#10ece8",
|
||||
"on-secondary-fixed": "#004746",
|
||||
"on-secondary-fixed-variant": "#006765",
|
||||
"tertiary": "#006386",
|
||||
"tertiary-dim": "#005675",
|
||||
"on-tertiary": "#e7f5ff",
|
||||
"tertiary-container": "#20c0ff",
|
||||
"on-tertiary-container": "#00374d",
|
||||
"tertiary-fixed": "#20c0ff",
|
||||
"tertiary-fixed-dim": "#00b2ee",
|
||||
"on-tertiary-fixed": "#001e2b",
|
||||
"on-tertiary-fixed-variant": "#004059",
|
||||
"error": "#b31b25",
|
||||
"error-dim": "#9f0519",
|
||||
"on-error": "#ffefee",
|
||||
"error-container": "#fb5151",
|
||||
"on-error-container": "#570008",
|
||||
"success": "#006c45",
|
||||
"on-success": "#ffffff",
|
||||
"success-container": "#86f9bc",
|
||||
"on-success-container": "#002112",
|
||||
"warning": "#7c5800",
|
||||
"on-warning": "#ffffff",
|
||||
"warning-container": "#ffdea6",
|
||||
"on-warning-container": "#271900",
|
||||
"info": "#005ac4",
|
||||
"on-info": "#ffffff",
|
||||
"info-container": "#d8e2ff",
|
||||
"on-info-container": "#001a42",
|
||||
"inverse-error": "#ff716c",
|
||||
"inverse-success": "#69dca1",
|
||||
"inverse-warning": "#fdbb28",
|
||||
"inverse-info": "#aec6ff"
|
||||
},
|
||||
"dark": {
|
||||
"background": "#001111",
|
||||
"on-background": "#b8f3f1",
|
||||
"surface": "#001111",
|
||||
"surface-dim": "#001111",
|
||||
"surface-bright": "#003231",
|
||||
"surface-container-lowest": "#000000",
|
||||
"surface-container-low": "#001716",
|
||||
"surface-container": "#001e1d",
|
||||
"surface-container-high": "#002424",
|
||||
"surface-container-highest": "#002b2a",
|
||||
"on-surface": "#b8f3f1",
|
||||
"on-surface-variant": "#7bb5b3",
|
||||
"outline": "#457f7d",
|
||||
"outline-variant": "#0e504f",
|
||||
"inverse-surface": "#e3fffd",
|
||||
"inverse-on-surface": "#215e5c",
|
||||
"primary": "#b4fff1",
|
||||
"primary-dim": "#00fee5",
|
||||
"on-primary": "#00665b",
|
||||
"primary-container": "#00fee5",
|
||||
"on-primary-container": "#005c53",
|
||||
"primary-fixed": "#00f7df",
|
||||
"primary-fixed-dim": "#00e8d1",
|
||||
"on-primary-fixed": "#00443c",
|
||||
"on-primary-fixed-variant": "#006359",
|
||||
"inverse-primary": "#006b60",
|
||||
"secondary": "#38fbf7",
|
||||
"secondary-dim": "#10ece8",
|
||||
"on-secondary": "#005c5a",
|
||||
"secondary-container": "#006a68",
|
||||
"on-secondary-container": "#dafffd",
|
||||
"secondary-fixed": "#38fbf7",
|
||||
"secondary-fixed-dim": "#10ece8",
|
||||
"on-secondary-fixed": "#004746",
|
||||
"on-secondary-fixed-variant": "#006765",
|
||||
"tertiary": "#68ccff",
|
||||
"tertiary-dim": "#20c0ff",
|
||||
"on-tertiary": "#00415a",
|
||||
"tertiary-container": "#20c0ff",
|
||||
"on-tertiary-container": "#00374d",
|
||||
"tertiary-fixed": "#20c0ff",
|
||||
"tertiary-fixed-dim": "#00b2ee",
|
||||
"on-tertiary-fixed": "#001e2b",
|
||||
"on-tertiary-fixed-variant": "#004059",
|
||||
"error": "#ff716c",
|
||||
"error-dim": "#d7383b",
|
||||
"on-error": "#490006",
|
||||
"error-container": "#9f0519",
|
||||
"on-error-container": "#ffa8a3",
|
||||
"success": "#69dca1",
|
||||
"on-success": "#003822",
|
||||
"success-container": "#005233",
|
||||
"on-success-container": "#86f9bc",
|
||||
"warning": "#fdbb28",
|
||||
"on-warning": "#412d00",
|
||||
"warning-container": "#5e4200",
|
||||
"on-warning-container": "#ffdea6",
|
||||
"info": "#aec6ff",
|
||||
"on-info": "#002e6a",
|
||||
"info-container": "#004396",
|
||||
"on-info-container": "#d8e2ff",
|
||||
"inverse-error": "#b31b25",
|
||||
"inverse-success": "#006c45",
|
||||
"inverse-warning": "#7c5800",
|
||||
"inverse-info": "#005ac4"
|
||||
}
|
||||
},
|
||||
"rose": {
|
||||
"label": "Rose",
|
||||
"seed": "#c2185b",
|
||||
"variant": "vibrant",
|
||||
"spec": "2025",
|
||||
"contrast": 0,
|
||||
"light": {
|
||||
"background": "#fff4f6",
|
||||
"on-background": "#492136",
|
||||
"surface": "#fff4f6",
|
||||
"surface-dim": "#ffc4de",
|
||||
"surface-bright": "#fff4f6",
|
||||
"surface-container-lowest": "#ffffff",
|
||||
"surface-container-low": "#ffecf2",
|
||||
"surface-container": "#ffe0ec",
|
||||
"surface-container-high": "#ffd8e8",
|
||||
"surface-container-highest": "#ffd0e4",
|
||||
"on-surface": "#492136",
|
||||
"on-surface-variant": "#7c4d64",
|
||||
"outline": "#9b6880",
|
||||
"outline-variant": "#d69db7",
|
||||
"inverse-surface": "#220215",
|
||||
"inverse-on-surface": "#c58da6",
|
||||
"primary": "#ae1d53",
|
||||
"primary-dim": "#9e0b47",
|
||||
"on-primary": "#ffeff0",
|
||||
"primary-container": "#ff7198",
|
||||
"on-primary-container": "#4d001e",
|
||||
"primary-fixed": "#ff7198",
|
||||
"primary-fixed-dim": "#f95a8a",
|
||||
"on-primary-fixed": "#000000",
|
||||
"on-primary-fixed-variant": "#5e0027",
|
||||
"inverse-primary": "#f65787",
|
||||
"secondary": "#99366e",
|
||||
"secondary-dim": "#8a2a62",
|
||||
"on-secondary": "#ffeff3",
|
||||
"secondary-container": "#ffc0dc",
|
||||
"on-secondary-container": "#7f2159",
|
||||
"secondary-fixed": "#ffc0dc",
|
||||
"secondary-fixed-dim": "#ffabd2",
|
||||
"on-secondary-fixed": "#670845",
|
||||
"on-secondary-fixed-variant": "#8b2b63",
|
||||
"tertiary": "#5c4bb4",
|
||||
"tertiary-dim": "#503ea7",
|
||||
"on-tertiary": "#f6f0ff",
|
||||
"tertiary-container": "#b3a5ff",
|
||||
"on-tertiary-container": "#301887",
|
||||
"tertiary-fixed": "#b3a5ff",
|
||||
"tertiary-fixed-dim": "#a595ff",
|
||||
"on-tertiary-fixed": "#170059",
|
||||
"on-tertiary-fixed-variant": "#39248f",
|
||||
"error": "#b31b25",
|
||||
"error-dim": "#9f0519",
|
||||
"on-error": "#ffefee",
|
||||
"error-container": "#fb5151",
|
||||
"on-error-container": "#570008",
|
||||
"success": "#006c45",
|
||||
"on-success": "#ffffff",
|
||||
"success-container": "#86f9bc",
|
||||
"on-success-container": "#002112",
|
||||
"warning": "#7c5800",
|
||||
"on-warning": "#ffffff",
|
||||
"warning-container": "#ffdea6",
|
||||
"on-warning-container": "#271900",
|
||||
"info": "#005ac4",
|
||||
"on-info": "#ffffff",
|
||||
"info-container": "#d8e2ff",
|
||||
"on-info-container": "#001a42",
|
||||
"inverse-error": "#ff716c",
|
||||
"inverse-success": "#69dca1",
|
||||
"inverse-warning": "#fdbb28",
|
||||
"inverse-info": "#aec6ff"
|
||||
},
|
||||
"dark": {
|
||||
"background": "#220215",
|
||||
"on-background": "#ffdcea",
|
||||
"surface": "#220215",
|
||||
"surface-dim": "#220215",
|
||||
"surface-bright": "#4e1737",
|
||||
"surface-container-lowest": "#000000",
|
||||
"surface-container-low": "#2a041b",
|
||||
"surface-container": "#330822",
|
||||
"surface-container-high": "#3c0d28",
|
||||
"surface-container-highest": "#45122f",
|
||||
"on-surface": "#ffdcea",
|
||||
"on-surface-variant": "#d49bb4",
|
||||
"outline": "#99667e",
|
||||
"outline-variant": "#663a50",
|
||||
"inverse-surface": "#fff8f8",
|
||||
"inverse-on-surface": "#75475d",
|
||||
"primary": "#ff8aa7",
|
||||
"primary-dim": "#ff6b95",
|
||||
"on-primary": "#620029",
|
||||
"primary-container": "#ff7198",
|
||||
"on-primary-container": "#4d001e",
|
||||
"primary-fixed": "#ff7198",
|
||||
"primary-fixed-dim": "#f95a8a",
|
||||
"on-primary-fixed": "#000000",
|
||||
"on-primary-fixed-variant": "#5e0027",
|
||||
"inverse-primary": "#b32257",
|
||||
"secondary": "#ff8ac6",
|
||||
"secondary-dim": "#ef7db9",
|
||||
"on-secondary": "#620241",
|
||||
"secondary-container": "#7f2058",
|
||||
"on-secondary-container": "#ffbedb",
|
||||
"secondary-fixed": "#ffc0dc",
|
||||
"secondary-fixed-dim": "#ffabd2",
|
||||
"on-secondary-fixed": "#670845",
|
||||
"on-secondary-fixed-variant": "#8b2b63",
|
||||
"tertiary": "#aa9bff",
|
||||
"tertiary-dim": "#9f8ffc",
|
||||
"on-tertiary": "#290c80",
|
||||
"tertiary-container": "#9d8cfa",
|
||||
"on-tertiary-container": "#1c0068",
|
||||
"tertiary-fixed": "#b3a5ff",
|
||||
"tertiary-fixed-dim": "#a595ff",
|
||||
"on-tertiary-fixed": "#170059",
|
||||
"on-tertiary-fixed-variant": "#39248f",
|
||||
"error": "#ff716c",
|
||||
"error-dim": "#d7383b",
|
||||
"on-error": "#490006",
|
||||
"error-container": "#9f0519",
|
||||
"on-error-container": "#ffa8a3",
|
||||
"success": "#69dca1",
|
||||
"on-success": "#003822",
|
||||
"success-container": "#005233",
|
||||
"on-success-container": "#86f9bc",
|
||||
"warning": "#fdbb28",
|
||||
"on-warning": "#412d00",
|
||||
"warning-container": "#5e4200",
|
||||
"on-warning-container": "#ffdea6",
|
||||
"info": "#aec6ff",
|
||||
"on-info": "#002e6a",
|
||||
"info-container": "#004396",
|
||||
"on-info-container": "#d8e2ff",
|
||||
"inverse-error": "#b31b25",
|
||||
"inverse-success": "#006c45",
|
||||
"inverse-warning": "#7c5800",
|
||||
"inverse-info": "#005ac4"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user