103 lines
4.9 KiB
Plaintext
103 lines
4.9 KiB
Plaintext
|
|
||
|
import type { CustomThemeConfig } from '@skeletonlabs/tw-plugin';
|
||
|
|
||
|
export const vinTheme: CustomThemeConfig = {
|
||
|
name: 'vin-theme',
|
||
|
properties: {
|
||
|
// =~= Theme Properties =~=
|
||
|
"--theme-font-family-base": `Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'`,
|
||
|
"--theme-font-family-heading": `Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'`,
|
||
|
"--theme-font-color-base": "var(--color-surface-400)",
|
||
|
"--theme-font-color-dark": "var(--color-surface-50)",
|
||
|
"--theme-rounded-base": "12px",
|
||
|
"--theme-rounded-container": "12px",
|
||
|
"--theme-border-base": "0px",
|
||
|
// =~= Theme On-X Colors =~=
|
||
|
"--on-primary": "var(--color-surface-500)",
|
||
|
"--on-secondary": "var(--color-surface-500)",
|
||
|
"--on-tertiary": "var(--color-surface-500)",
|
||
|
"--on-success": "var(--color-surface-500)",
|
||
|
"--on-warning": "var(--color-surface-500)",
|
||
|
"--on-error": "var(--color-surface-500)",
|
||
|
"--on-surface": "var(--color-surface-50)",
|
||
|
// =~= Theme Colors =~=
|
||
|
// primary | #7DE8B2
|
||
|
"--color-primary-50": "236 252 243", // #ecfcf3
|
||
|
"--color-primary-100": "229 250 240", // #e5faf0
|
||
|
"--color-primary-200": "223 249 236", // #dff9ec
|
||
|
"--color-primary-300": "203 246 224", // #cbf6e0
|
||
|
"--color-primary-400": "164 239 201", // #a4efc9
|
||
|
"--color-primary-500": "125 232 178", // #7DE8B2
|
||
|
"--color-primary-600": "113 209 160", // #71d1a0
|
||
|
"--color-primary-700": "94 174 134", // #5eae86
|
||
|
"--color-primary-800": "75 139 107", // #4b8b6b
|
||
|
"--color-primary-900": "61 114 87", // #3d7257
|
||
|
// secondary | #7DE8E8
|
||
|
"--color-secondary-50": "236 252 252", // #ecfcfc
|
||
|
"--color-secondary-100": "229 250 250", // #e5fafa
|
||
|
"--color-secondary-200": "223 249 249", // #dff9f9
|
||
|
"--color-secondary-300": "203 246 246", // #cbf6f6
|
||
|
"--color-secondary-400": "164 239 239", // #a4efef
|
||
|
"--color-secondary-500": "125 232 232", // #7DE8E8
|
||
|
"--color-secondary-600": "113 209 209", // #71d1d1
|
||
|
"--color-secondary-700": "94 174 174", // #5eaeae
|
||
|
"--color-secondary-800": "75 139 139", // #4b8b8b
|
||
|
"--color-secondary-900": "61 114 114", // #3d7272
|
||
|
// tertiary | #7D7DE8
|
||
|
"--color-tertiary-50": "236 236 252", // #ececfc
|
||
|
"--color-tertiary-100": "229 229 250", // #e5e5fa
|
||
|
"--color-tertiary-200": "223 223 249", // #dfdff9
|
||
|
"--color-tertiary-300": "203 203 246", // #cbcbf6
|
||
|
"--color-tertiary-400": "164 164 239", // #a4a4ef
|
||
|
"--color-tertiary-500": "125 125 232", // #7D7DE8
|
||
|
"--color-tertiary-600": "113 113 209", // #7171d1
|
||
|
"--color-tertiary-700": "94 94 174", // #5e5eae
|
||
|
"--color-tertiary-800": "75 75 139", // #4b4b8b
|
||
|
"--color-tertiary-900": "61 61 114", // #3d3d72
|
||
|
// success | #7DE8B2
|
||
|
"--color-success-50": "236 252 243", // #ecfcf3
|
||
|
"--color-success-100": "229 250 240", // #e5faf0
|
||
|
"--color-success-200": "223 249 236", // #dff9ec
|
||
|
"--color-success-300": "203 246 224", // #cbf6e0
|
||
|
"--color-success-400": "164 239 201", // #a4efc9
|
||
|
"--color-success-500": "125 232 178", // #7DE8B2
|
||
|
"--color-success-600": "113 209 160", // #71d1a0
|
||
|
"--color-success-700": "94 174 134", // #5eae86
|
||
|
"--color-success-800": "75 139 107", // #4b8b6b
|
||
|
"--color-success-900": "61 114 87", // #3d7257
|
||
|
// warning | #E8D67D
|
||
|
"--color-warning-50": "252 249 236", // #fcf9ec
|
||
|
"--color-warning-100": "250 247 229", // #faf7e5
|
||
|
"--color-warning-200": "249 245 223", // #f9f5df
|
||
|
"--color-warning-300": "246 239 203", // #f6efcb
|
||
|
"--color-warning-400": "239 226 164", // #efe2a4
|
||
|
"--color-warning-500": "232 214 125", // #E8D67D
|
||
|
"--color-warning-600": "209 193 113", // #d1c171
|
||
|
"--color-warning-700": "174 161 94", // #aea15e
|
||
|
"--color-warning-800": "139 128 75", // #8b804b
|
||
|
"--color-warning-900": "114 105 61", // #72693d
|
||
|
// error | #E87D7D
|
||
|
"--color-error-50": "252 236 236", // #fcecec
|
||
|
"--color-error-100": "250 229 229", // #fae5e5
|
||
|
"--color-error-200": "249 223 223", // #f9dfdf
|
||
|
"--color-error-300": "246 203 203", // #f6cbcb
|
||
|
"--color-error-400": "239 164 164", // #efa4a4
|
||
|
"--color-error-500": "232 125 125", // #E87D7D
|
||
|
"--color-error-600": "209 113 113", // #d17171
|
||
|
"--color-error-700": "174 94 94", // #ae5e5e
|
||
|
"--color-error-800": "139 75 75", // #8b4b4b
|
||
|
"--color-error-900": "114 61 61", // #723d3d
|
||
|
// surface | #1A1A1A
|
||
|
"--color-surface-50": "221 221 221", // #dddddd
|
||
|
"--color-surface-100": "209 209 209", // #d1d1d1
|
||
|
"--color-surface-200": "198 198 198", // #c6c6c6
|
||
|
"--color-surface-300": "163 163 163", // #a3a3a3
|
||
|
"--color-surface-400": "95 95 95", // #5f5f5f
|
||
|
"--color-surface-500": "26 26 26", // #1A1A1A
|
||
|
"--color-surface-600": "23 23 23", // #171717
|
||
|
"--color-surface-700": "20 20 20", // #141414
|
||
|
"--color-surface-800": "16 16 16", // #101010
|
||
|
"--color-surface-900": "13 13 13", // #0d0d0d
|
||
|
|
||
|
}
|
||
|
}
|