Arc
Browser rethought around sidebar-first navigation
Sidebar-first navigation
Extracted with Dembrandt. Showing a simplified version — the full output includes button states, logos, gradients, animations, and more. Try the CLI for complete results.
Colors
#fffcec
#000000
#696969
#2702c2
#170394
Typography
Marlin Soft SQ, -apple-system, system-ui
hero:45.51px / 700
body:17px / 700
button:14px / 600
Shadows
sm
md
Spacing
2px3px4px8px16px20px
Border Radius
8px
10px
Button States
PrimeReactDefault
#ffffffHover
#ffffffActive
#ffffffradius: 10pxpadding: 8px 0px
output.json
{
"url": "arc.net",
"colors": [
"#fffcec",
"#000000",
"#696969",
"#2702c2",
"#170394"
],
"typography": {
"fontFamily": "Marlin Soft SQ, -apple-system, system-ui",
"hero": "45.51px / 700",
"body": "17px / 700",
"button": "14px / 600"
},
"shadows": [
"rgba(0, 0, 0, 0.1) 0px 5px 5px 0px",
"rgba(0, 0, 0, 0.25) 0px 2px 8px 0px"
],
"spacing": [
"2px",
"3px",
"4px",
"8px",
"16px",
"20px"
],
"borderRadius": [
"8px",
"10px"
],
"buttons": {
"default": {
"bg": "#ffffff",
"text": "#2702c2"
},
"hover": {
"bg": "#ffffff",
"text": "#2702c2"
},
"active": {
"bg": "#ffffff",
"text": "#2702c2"
},
"radius": "10px",
"padding": "8px 0px",
"framework": "PrimeReact"
}
}$npx dembrandt arc.net