@maggioli-design-system/design-tokens
Version:
This is the Design Token library of Maggioli Design System, here you'll find all the visual data used around the libraries.
1,454 lines • 28.8 kB
JSON
{
"color": {
"tone": {
"neutral": {
"light": {
"1": {
"value": "#212121"
},
"2": {
"value": "#282828"
},
"3": {
"value": "#404040"
},
"4": {
"value": "#545454"
},
"5": {
"value": "#717171"
},
"6": {
"value": "#a2a2a2"
},
"7": {
"value": "#d4d4d4"
},
"8": {
"value": "#e7e7e7"
},
"9": {
"value": "#f3f3f3"
},
"10": {
"value": "#f8f8f8"
},
"color": {
"value": "#FFFFFF"
}
},
"dark": {
"1": {
"value": "#e1e1e1"
},
"2": {
"value": "#d8d8d8"
},
"3": {
"value": "#b5b5b5"
},
"4": {
"value": "#9b9b9b"
},
"5": {
"value": "#7a7a7a"
},
"6": {
"value": "#4e4e4e"
},
"7": {
"value": "#2b2b2b"
},
"8": {
"value": "#1d1d1d"
},
"9": {
"value": "#0f0f0f"
},
"10": {
"value": "#090909"
},
"color": {
"value": "#000000"
}
}
}
},
"status": {
"info": {
"light": {
"1": {
"value": "#001942"
},
"2": {
"value": "#00446d"
},
"3": {
"value": "#00517c"
},
"4": {
"value": "#00628d"
},
"5": {
"value": "#0075a2"
},
"6": {
"value": "#0099c7"
},
"7": {
"value": "#7acaeb"
},
"8": {
"value": "#b0dff3"
},
"9": {
"value": "#d1ecf8"
},
"10": {
"value": "#ecf7fc"
},
"color": {
"value": "#23B2E1"
}
},
"dark": {
"1": {
"value": "#d2edf9"
},
"2": {
"value": "#61c1e7"
},
"3": {
"value": "#22b1e0"
},
"4": {
"value": "#009dcc"
},
"5": {
"value": "#0087b5"
},
"6": {
"value": "#006691"
},
"7": {
"value": "#003c65"
},
"8": {
"value": "#002851"
},
"9": {
"value": "#001941"
},
"10": {
"value": "#000a34"
},
"color": {
"value": "#23B2E1"
}
}
},
"success": {
"light": {
"1": {
"value": "#002100"
},
"2": {
"value": "#004c03"
},
"3": {
"value": "#005a14"
},
"4": {
"value": "#006b25"
},
"5": {
"value": "#007f37"
},
"6": {
"value": "#00a359"
},
"7": {
"value": "#77d29a"
},
"8": {
"value": "#afe4c1"
},
"9": {
"value": "#d1efda"
},
"10": {
"value": "#ebf8ef"
},
"color": {
"value": "#21BF73"
}
},
"dark": {
"1": {
"value": "#d2f0db"
},
"2": {
"value": "#5ccb8b"
},
"3": {
"value": "#19bb70"
},
"4": {
"value": "#00a75d"
},
"5": {
"value": "#009148"
},
"6": {
"value": "#006f28"
},
"7": {
"value": "#004400"
},
"8": {
"value": "#003000"
},
"9": {
"value": "#002100"
},
"10": {
"value": "#001400"
},
"color": {
"value": "#21BF73"
}
}
},
"error": {
"light": {
"1": {
"value": "#400000"
},
"2": {
"value": "#88000e"
},
"3": {
"value": "#9a111f"
},
"4": {
"value": "#ac292e"
},
"5": {
"value": "#c23f40"
},
"6": {
"value": "#e96260"
},
"7": {
"value": "#fbaba5"
},
"8": {
"value": "#ffccc8"
},
"9": {
"value": "#ffe1df"
},
"10": {
"value": "#fff3f1"
},
"color": {
"value": "#ED6663"
}
},
"dark": {
"1": {
"value": "#ffe3e0"
},
"2": {
"value": "#f99d97"
},
"3": {
"value": "#f4847e"
},
"4": {
"value": "#ed6763"
},
"5": {
"value": "#d65150"
},
"6": {
"value": "#b12d32"
},
"7": {
"value": "#7a0001"
},
"8": {
"value": "#590000"
},
"9": {
"value": "#420000"
},
"10": {
"value": "#270000"
},
"color": {
"value": "#ED6663"
}
}
},
"warning": {
"light": {
"1": {
"value": "#231a00"
},
"2": {
"value": "#523d00"
},
"3": {
"value": "#624900"
},
"4": {
"value": "#755700"
},
"5": {
"value": "#8b6800"
},
"6": {
"value": "#b38700"
},
"7": {
"value": "#f3b600"
},
"8": {
"value": "#ffd451"
},
"9": {
"value": "#ffe69c"
},
"10": {
"value": "#fff5d6"
},
"color": {
"value": "#FFC107"
}
},
"dark": {
"1": {
"value": "#ffe7a1"
},
"2": {
"value": "#e6ac00"
},
"3": {
"value": "#d09c00"
},
"4": {
"value": "#b98a00"
},
"5": {
"value": "#9f7700"
},
"6": {
"value": "#795a00"
},
"7": {
"value": "#493700"
},
"8": {
"value": "#332600"
},
"9": {
"value": "#231a00"
},
"10": {
"value": "#130e00"
},
"color": {
"value": "#FFC107"
}
}
}
},
"label": {
"amaranth": {
"light": {
"1": {
"value": "#3a0614"
},
"2": {
"value": "#810d2c"
},
"3": {
"value": "#9a1034"
},
"4": {
"value": "#b5133d"
},
"5": {
"value": "#d61649"
},
"6": {
"value": "#ee5980"
},
"7": {
"value": "#f6abbf"
},
"8": {
"value": "#facdd9"
},
"9": {
"value": "#fce2e8"
},
"10": {
"value": "#fef2f5"
},
"color": {
"value": "#EA3464"
}
},
"dark": {
"1": {
"value": "#fce2e9"
},
"2": {
"value": "#f59cb4"
},
"3": {
"value": "#f2819f"
},
"4": {
"value": "#ef6186"
},
"5": {
"value": "#ea3263"
},
"6": {
"value": "#bb1340"
},
"7": {
"value": "#740c27"
},
"8": {
"value": "#53091c"
},
"9": {
"value": "#3b0614"
},
"10": {
"value": "#23040c"
},
"color": {
"value": "#EA3464"
}
}
},
"orchid": {
"light": {
"1": {
"value": "#330731"
},
"2": {
"value": "#73106e"
},
"3": {
"value": "#891482"
},
"4": {
"value": "#a2179a"
},
"5": {
"value": "#c01bb8"
},
"6": {
"value": "#e54add"
},
"7": {
"value": "#f2a7ee"
},
"8": {
"value": "#f7caf5"
},
"9": {
"value": "#fbe1f9"
},
"10": {
"value": "#fdf0fc"
},
"color": {
"value": "#E33BDA"
}
},
"dark": {
"1": {
"value": "#fbe0f9"
},
"2": {
"value": "#f096eb"
},
"3": {
"value": "#ec7ae6"
},
"4": {
"value": "#e653df"
},
"5": {
"value": "#db1fd1"
},
"6": {
"value": "#a818a0"
},
"7": {
"value": "#670f62"
},
"8": {
"value": "#490a46"
},
"9": {
"value": "#330731"
},
"10": {
"value": "#20051e"
},
"color": {
"value": "#E33BDA"
}
}
},
"violet": {
"light": {
"1": {
"value": "#220456"
},
"2": {
"value": "#4908ba"
},
"3": {
"value": "#570adc"
},
"4": {
"value": "#6c1df5"
},
"5": {
"value": "#8441f7"
},
"6": {
"value": "#a472f9"
},
"7": {
"value": "#ceb3fc"
},
"8": {
"value": "#e1d1fd"
},
"9": {
"value": "#eee5fe"
},
"10": {
"value": "#f7f3fe"
},
"color": {
"value": "#782FF6"
}
},
"dark": {
"1": {
"value": "#eee5fe"
},
"2": {
"value": "#c6a6fb"
},
"3": {
"value": "#b791fa"
},
"4": {
"value": "#a878f9"
},
"5": {
"value": "#955bf8"
},
"6": {
"value": "#7125f6"
},
"7": {
"value": "#4207a7"
},
"8": {
"value": "#30057a"
},
"9": {
"value": "#230458"
},
"10": {
"value": "#150236"
},
"color": {
"value": "#782FF6"
}
}
},
"blue": {
"light": {
"1": {
"value": "#031156"
},
"2": {
"value": "#0727bd"
},
"3": {
"value": "#082ee0"
},
"4": {
"value": "#1b40f6"
},
"5": {
"value": "#3c5cf8"
},
"6": {
"value": "#6d85fa"
},
"7": {
"value": "#b0bdfc"
},
"8": {
"value": "#cfd7fd"
},
"9": {
"value": "#e3e8fe"
},
"10": {
"value": "#f2f4ff"
},
"color": {
"value": "#0E36F6"
}
},
"dark": {
"1": {
"value": "#e3e8fe"
},
"2": {
"value": "#a2b1fc"
},
"3": {
"value": "#8b9ffb"
},
"4": {
"value": "#7289fa"
},
"5": {
"value": "#5571f9"
},
"6": {
"value": "#2246f7"
},
"7": {
"value": "#0623aa"
},
"8": {
"value": "#05197a"
},
"9": {
"value": "#031155"
},
"10": {
"value": "#020b36"
},
"color": {
"value": "#0E36F6"
}
}
},
"sky": {
"light": {
"1": {
"value": "#011c31"
},
"2": {
"value": "#034273"
},
"3": {
"value": "#044f89"
},
"4": {
"value": "#055ea2"
},
"5": {
"value": "#0570c1"
},
"6": {
"value": "#0890f8"
},
"7": {
"value": "#83c7fc"
},
"8": {
"value": "#b3ddfd"
},
"9": {
"value": "#d4ecfe"
},
"10": {
"value": "#ebf6fe"
},
"color": {
"value": "#4DAFFA"
}
},
"dark": {
"1": {
"value": "#d4ecfe"
},
"2": {
"value": "#6bbdfb"
},
"3": {
"value": "#44abfa"
},
"4": {
"value": "#1495f8"
},
"5": {
"value": "#0680dc"
},
"6": {
"value": "#0561a8"
},
"7": {
"value": "#033b67"
},
"8": {
"value": "#022a49"
},
"9": {
"value": "#011e33"
},
"10": {
"value": "#01111e"
},
"color": {
"value": "#4DAFFA"
}
}
},
"aqua": {
"light": {
"1": {
"value": "#011f1c"
},
"2": {
"value": "#034941"
},
"3": {
"value": "#03574d"
},
"4": {
"value": "#04675c"
},
"5": {
"value": "#047c6d"
},
"6": {
"value": "#069f8d"
},
"7": {
"value": "#08d7be"
},
"8": {
"value": "#09f2d6"
},
"9": {
"value": "#8cfbee"
},
"10": {
"value": "#d4fdf8"
},
"color": {
"value": "#74FAEA"
}
},
"dark": {
"1": {
"value": "#90fbee"
},
"2": {
"value": "#07cbb4"
},
"3": {
"value": "#07b8a3"
},
"4": {
"value": "#06a391"
},
"5": {
"value": "#058d7d"
},
"6": {
"value": "#046b5f"
},
"7": {
"value": "#02413a"
},
"8": {
"value": "#022e28"
},
"9": {
"value": "#01201c"
},
"10": {
"value": "#011210"
},
"color": {
"value": "#74FAEA"
}
}
},
"green": {
"light": {
"1": {
"value": "#052001"
},
"2": {
"value": "#0c4b03"
},
"3": {
"value": "#0e5a04"
},
"4": {
"value": "#116b04"
},
"5": {
"value": "#147f05"
},
"6": {
"value": "#1aa406"
},
"7": {
"value": "#23de09"
},
"8": {
"value": "#55f73e"
},
"9": {
"value": "#affba4"
},
"10": {
"value": "#ddfdd8"
},
"color": {
"value": "#78F966"
}
},
"dark": {
"1": {
"value": "#b0fba6"
},
"2": {
"value": "#21d208"
},
"3": {
"value": "#1ebe07"
},
"4": {
"value": "#1ba907"
},
"5": {
"value": "#179106"
},
"6": {
"value": "#116f04"
},
"7": {
"value": "#0b4303"
},
"8": {
"value": "#072f02"
},
"9": {
"value": "#052101"
},
"10": {
"value": "#031301"
},
"color": {
"value": "#78F966"
}
}
},
"lime": {
"light": {
"1": {
"value": "#161d01"
},
"2": {
"value": "#354602"
},
"3": {
"value": "#3f5402"
},
"4": {
"value": "#4b6402"
},
"5": {
"value": "#597703"
},
"6": {
"value": "#749a04"
},
"7": {
"value": "#9dd105"
},
"8": {
"value": "#b0eb05"
},
"9": {
"value": "#c7fa33"
},
"10": {
"value": "#eafdb4"
},
"color": {
"value": "#CFFB50"
}
},
"dark": {
"1": {
"value": "#c9fa39"
},
"2": {
"value": "#94c505"
},
"3": {
"value": "#86b304"
},
"4": {
"value": "#779e04"
},
"5": {
"value": "#668903"
},
"6": {
"value": "#4e6802"
},
"7": {
"value": "#2f3f01"
},
"8": {
"value": "#212c01"
},
"9": {
"value": "#171f01"
},
"10": {
"value": "#0d1100"
},
"color": {
"value": "#CFFB50"
}
}
},
"yellow": {
"light": {
"1": {
"value": "#201b01"
},
"2": {
"value": "#4b4103"
},
"3": {
"value": "#584c03"
},
"4": {
"value": "#6a5b04"
},
"5": {
"value": "#7f6d04"
},
"6": {
"value": "#a38d06"
},
"7": {
"value": "#ddbf07"
},
"8": {
"value": "#f7d81b"
},
"9": {
"value": "#fbea82"
},
"10": {
"value": "#fdf5c5"
},
"color": {
"value": "#F9E14E"
}
},
"dark": {
"1": {
"value": "#fbea86"
},
"2": {
"value": "#d1b407"
},
"3": {
"value": "#bda306"
},
"4": {
"value": "#a89106"
},
"5": {
"value": "#917d05"
},
"6": {
"value": "#6e5f04"
},
"7": {
"value": "#423902"
},
"8": {
"value": "#2e2802"
},
"9": {
"value": "#201b01"
},
"10": {
"value": "#110f01"
},
"color": {
"value": "#F9E14E"
}
}
},
"orange": {
"light": {
"1": {
"value": "#311203"
},
"2": {
"value": "#712a08"
},
"3": {
"value": "#863209"
},
"4": {
"value": "#a03b0b"
},
"5": {
"value": "#be470d"
},
"6": {
"value": "#ef601b"
},
"7": {
"value": "#f7af8d"
},
"8": {
"value": "#fad0bb"
},
"9": {
"value": "#fce4d8"
},
"10": {
"value": "#fef3ed"
},
"color": {
"value": "#F17032"
}
},
"dark": {
"1": {
"value": "#fce4d8"
},
"2": {
"value": "#f6a178"
},
"3": {
"value": "#f38854"
},
"4": {
"value": "#f06826"
},
"5": {
"value": "#d9510f"
},
"6": {
"value": "#a63d0b"
},
"7": {
"value": "#652607"
},
"8": {
"value": "#471a05"
},
"9": {
"value": "#321303"
},
"10": {
"value": "#1b0a02"
},
"color": {
"value": "#F17032"
}
}
}
},
"variant": {
"primary": {
"light": {
"1": {
"value": "#001846"
},
"2": {
"value": "#00379e"
},
"3": {
"value": "#0041bc"
},
"4": {
"value": "#004ddf"
},
"5": {
"value": "#0a5fff"
},
"6": {
"value": "#4c8aff"
},
"7": {
"value": "#a0c1ff"
},
"8": {
"value": "#c5d9ff"
},
"9": {
"value": "#dde9ff"
},
"10": {
"value": "#eef4ff"
},
"color": {
"value": "#00379E"
}
},
"dark": {
"1": {
"value": "#dee9ff"
},
"2": {
"value": "#8fb6ff"
},
"3": {
"value": "#73a3ff"
},
"4": {
"value": "#528eff"
},
"5": {
"value": "#2c76ff"
},
"6": {
"value": "#0050e6"
},
"7": {
"value": "#00318d"
},
"8": {
"value": "#002364"
},
"9": {
"value": "#001846"
},
"10": {
"value": "#000e28"
},
"color": {
"value": "#00379E"
}
}
},
"secondary": {
"light": {
"1": {
"value": "#051744"
},
"2": {
"value": "#0b369d"
},
"3": {
"value": "#0d41ba"
},
"4": {
"value": "#104ddd"
},
"5": {
"value": "#2662f0"
},
"6": {
"value": "#5c89f4"
},
"7": {
"value": "#a7bff9"
},
"8": {
"value": "#cad9fb"
},
"9": {
"value": "#e0e9fd"
},
"10": {
"value": "#f1f5fe"
},
"color": {
"value": "#0f4ad5"
}
},
"dark": {
"1": {
"value": "#e0e9fd"
},
"2": {
"value": "#98b5f8"
},
"3": {
"value": "#7fa2f6"
},
"4": {
"value": "#638ef4"
},
"5": {
"value": "#4276f2"
},
"6": {
"value": "#1050e5"
},
"7": {
"value": "#0a318c"
},
"8": {
"value": "#072263"
},
"9": {
"value": "#051845"
},
"10": {
"value": "#030d26"
},
"color": {
"value": "#0f4ad5"
}
}
},
"ai": {
"light": {
"1": {
"value": "#220456"
},
"2": {
"value": "#4908ba"
},
"3": {
"value": "#570adc"
},
"4": {
"value": "#6c1df5"
},
"5": {
"value": "#8441f7"
},
"6": {
"value": "#a472f9"
},
"7": {
"value": "#ceb3fc"
},
"8": {
"value": "#e1d1fd"
},
"9": {
"value": "#eee5fe"
},
"10": {
"value": "#f7f3fe"
},
"color": {
"value": "#782FF6"
}
},
"dark": {
"1": {
"value": "#eee5fe"
},
"2": {
"value": "#c6a6fb"
},
"3": {
"value": "#b791fa"
},
"4": {
"value": "#a878f9"
},
"5": {
"value": "#955bf8"
},
"6": {
"value": "#7125f6"
},
"7": {
"value": "#4207a7"
},
"8": {
"value": "#30057a"
},
"9": {
"value": "#230458"
},
"10": {
"value": "#150236"
},
"color": {
"value": "#782FF6"
}
}
}
},
"brand": {
"maggioli": {
"light": {
"1": {
"value": "#0c1a36"
},
"2": {
"value": "#00379e"
},
"3": {
"value": "#0242b9"
},
"4": {
"value": "#0a50d4"
},
"5": {
"value": "#1f65e8"
},
"6": {
"value": "#638ddd"
},
"7": {
"value": "#b2c1dc"
},
"8": {
"value": "#d2d8e4"
},
"9": {
"value": "#e6e9ed"
},
"10": {
"value": "#f4f5f6"
},
"color": {
"value": "#00379E"
}
},
"dark": {
"1": {
"value": "#e6e8ec"
},
"2": {
"value": "#a3b6db"
},
"3": {
"value": "#89a5da"
},
"4": {
"value": "#6a91dc"
},
"5": {
"value": "#447ae1"
},
"6": {
"value": "#0c54da"
},
"7": {
"value": "#01318c"
},
"8": {
"value": "#07255c"
},
"9": {
"value": "#0c1b37"
},
"10": {
"value": "#0b0e14"
},
"color": {
"value": "#00379E"
}
}
},
"maggioli-editore": {
"light": {
"1": {
"value": "#151b28"
},
"2": {
"value": "#133993"
},
"3": {
"value": "#1042b7"
},
"4": {
"value": "#104ddd"
},
"5": {
"value": "#2b63e9"
},
"6": {
"value": "#668be2"
},
"7": {
"value": "#b2c0e0"
},
"8": {
"value": "#d2d8e5"
},
"9": {
"value": "#e6e8ed"
},
"10": {
"value": "#f4f5f6"
},
"color": {
"value": "#0f4ad5"
}
},
"dark": {
"1": {
"value": "#e6e8ed"
},
"2": {
"value": "#a4b5df"
},
"3": {
"value": "#8aa4df"
},
"4": {
"value": "#6d8fe1"
},
"5": {
"value": "#4a78e5"
},
"6": {
"value": "#1150e4"
},
"7": {
"value": "#16347c"
},
"8": {
"value": "#192748"
},
"9": {
"value": "#151b28"
},
"10": {
"value": "#0e1014"
},
"color": {
"value": "#0f4ad5"
}
}
}
}
}
}