If you’d like to customize the appearance of your divider, we’ve prepared a code snippet that makes it easy to modify and style it the way you want.
Simply paste the code below into the CSS tab of the custom code section in your dashboard.
You can set:
- divider line thickness (height = 1px by default in Super)
- divider color (uses Super border color by default → change for any HEX color)
- divider corner radius (border-radius: 0 px = sharp corners / 1+ px = rounded corners)
- divider line width (width: 100 % by default in Super)
- divider allignment (centered by default → just remove margin rows for specific alignment)
.notion-divider {
border-bottom: none !important;
height: 2px !important; /* change thickness */
background-color: var(--color-border-default) !important; /* change color */
border-radius: 10px !important; /* change corner radius */
width: 50% !important; /* change width */
margin-left: auto !important; /* remove this for left alignment */
margin-right: auto !important; /* remove this for right alignment */
}