How to add gradient underline color under navigation links

[tuanphan]

To add gradient underline color under navigation links on Squarespace, same as secondary nav on this page.

You can use this code to Custom CSS.

div.header-nav-item--active>a:after, .header-menu-nav-item--active>a:after {
    content: "";
    display: inline-block;
    background-image: linear-gradient(to right,#FD3459, green) !important;
    height: 2px;
    width: 100%;
    position: absolute;
    bottom: 0;
}
div.header-nav-item--active>a, .header-menu-nav-item--active>a {
    background-image: none !important;
    position: relative;
}

You can change underline color here.

and underline height here.