MPS Medica Logo

MediSphere

Making medication administration safe for everyone

Theme Editor

1. Edit a field using "cmd+click".2. Save a field using "cmd+enter".3. Copy the theme JSON using the "Copy To Clipboard" button4. Paste a theme JSON using "cmd+v".
theme:{
appbar:{
bg:
"rgb(255, 255, 255)"
fg:
"rgb(79, 38, 118)"
}
backgrounds:{
dark:{
bg:
"none"
fg:
"none"
}
darker:{
bg:
"rgba(46, 26, 74, 0.8)"
fg:
"none"
}
default:{
bg:
"rgb(81, 53, 119)"
fg:
"rgb(255, 255, 255)"
}
light:{
bg:
"rgb(225, 175, 255)"
fg:
"rgb(79, 38, 118)"
}
lighter:{
bg:
"rgb(251, 244, 255)"
fg:
"rgb(31, 41, 55)"
}
}
body:{
background:
"rgb(79, 38, 118)"
}
button:{
border:{
color:
"transparent"
radius:
"0px"
width:
"0"
}
danger:{
bg:
"rgb(239, 68, 68)"
fg:
"rgb(255, 255, 255)"
}
disabled:{
bg:
"rgb(245, 245, 245)"
fg:
"rgb(156, 163, 175)"
}
info:{
bg:
"rgb(255, 255, 255)"
border:{
color:
"rgb(0, 0, 0)"
}
fg:
"rgb(0, 0, 0)"
}
primary:{
bg:
"#4BE1C5"
border:{
color:
"#4BE1C5"
}
fg:
"rgb(0, 0, 0)"
}
secondary:{
bg:
"rgb(255, 132, 186)"
border:{
color:
"rgb(255, 132, 186)"
}
fg:
"rgb(0, 0, 0)"
}
success:{
bg:
"rgb(28, 176, 126)"
fg:
"rgb(255, 255, 255)"
}
warning:{
bg:
"rgb(255, 153, 118)"
fg:
"rgb(255, 255, 255)"
}
}
dialog:{
primary:{
backdrop:{
bg:
"rgba(0, 0, 0, 0.3)"
}
bg:
"rgb(81, 53, 119)"
border:{
color:
"rgb(0, 0, 0)"
radius:
"0px"
width:
"1px"
}
fg:
"rgb(255, 255, 255)"
padding:
"2rem"
}
secondary:{
backdrop:{
bg:
"rgba(0, 0, 0, 0.3)"
}
bg:
"rgb(225, 175, 255)"
border:{
color:
"rgb(0, 0, 0)"
radius:
"0px"
width:
"1px"
}
fg:
"rgb(0, 0, 0)"
padding:
"2rem"
}
}
drawer:{
bg:
"white"
fg:
"rgb(75, 85, 99)"
padding:
"1rem"
}
draweritem:{
border:{
color:
"unset"
radius:
"0px"
width:
"0px"
}
gap:
1
padding:
"0.8rem 1rem 0.8rem 1rem"
}
dropdown:{
default:{
bg:
"rgb(81, 53, 119)"
fg:
"rgb(255, 255, 255)"
}
light:{
bg:
"rgb(225, 175, 255)"
fg:
"rgb(79, 38, 118)"
}
}
forms:{
input:{
bg:
"rgb(255, 255, 255)"
border:{
color:
"rgb(0, 0, 0)"
radius:
"0px"
width:
"0px"
}
padding:
"0.9rem"
}
}
medicineColor:{
controlledDrug:
"#007F00"
cytotoxic:
"#A032E1"
nonCytotoxic:
"#A032E1"
psychotropic:
"#FF4C00"
reproductiveHazardous:
"#E50090"
}
paper:{
danger:{
bg:
"rgb(239, 68, 68)"
fg:
"rgb(255, 255, 255)"
}
info:{
bg:
"rgb(238, 224, 255)"
fg:
"rgb(0, 0, 0)"
}
primary:{
bg:
"rgb(81, 53, 119)"
fg:
"rgb(255, 255, 255)"
}
secondary:{
bg:
"rgb(255, 255, 255)"
fg:
"rgb(0, 0, 0)"
}
success:{
bg:
"#4BE1C5"
fg:
"rgb(255, 255, 255)"
}
warning:{
bg:
"rgb(255, 255, 255)"
fg:
"rgb(251, 133, 0)"
}
}
roundStats:{
charts:
"#A032E1"
missed:
"#FF4C00"
nims:
"#FF89BE"
nostock:
"#F3DB01"
offSite:
"#C4C4C4"
other:
"#00151A"
prns:
"#FF89BE"
withheld:
"#F3DB01"
}
table:{
body:{
bg:
"rgb(255, 255, 255)"
cell:{
padding:
"1rem"
}
fg:
"rgb(0, 0, 0)"
}
border:{
inner:{
color:
"rgba(0, 0, 0, 0.1)"
width:
"0.5px"
}
outer:{
color:
"rgba(255, 255, 255, 0.3)"
radius:
"0px"
width:
"0px"
}
}
header:{
bg:
"rgb(255, 255, 255)"
cell:{
padding:
"0.5rem 1rem"
}
fg:
"rgb(0, 0, 0)"
}
}
toast:{
danger:{
bg:
"rgb(239, 68, 68)"
fg:
"rgb(255, 255, 255)"
}
default:{
bg:
"rgb(255, 255, 255)"
fg:
"rgb(0, 0, 0)"
}
info:{
bg:
"rgb(255, 255, 255)"
fg:
"rgb(0, 0, 0)"
}
primary:{
bg:
"rgb(255, 255, 255)"
fg:
"rgb(225, 175, 255)"
}
secondary:{
bg:
"rgb(255, 255, 255)"
fg:
"rgb(238, 224, 255)"
}
success:{
bg:
"rgb(28, 176, 126)"
fg:
"rgb(255, 255, 255)"
}
warning:{
bg:
"rgb(255, 153, 118)"
fg:
"rgb(255, 255, 255)"
}
}
typography:{
defaults:{
color:
"black"
fontFamily:
"Whitney, sans-serif"
fontSize:
"16px"
fontWeight:
"200"
margin:
"0px"
}
h1:{
color:
"rgb(79, 38, 118)"
fontFamily:
"Whitney"
fontSize:
"2rem"
fontWeight:
"bold"
margin:
"0 0 8px 0"
}
h2:{
color:
"rgb(79, 38, 118)"
fontFamily:
"Whitney"
fontSize:
"1.65rem"
fontWeight:
"400"
margin:
"0 0 4px 0"
}
h3:{
color:
"rgb(79, 38, 118)"
fontFamily:
"Whitney"
fontSize:
"1.25rem"
fontWeight:
"400"
}
h4:{
color:
"rgb(79, 38, 118)"
fontFamily:
"Whitney"
fontSize:
"1.15"
fontWeight:
"400"
}
link:{
color:
"rgb(79, 38, 118)"
underlined:
false
}
}
}