.container {
    display: flex;
    flex-wrap: wrap; /* Allow wrapping of items */
    gap: 10px; /* Space between buttons */
}

.clickable-button, .clickable-div {
    display: flex;
    align-items: center;   /* Vertically center content */
    justify-content: center; /* Horizontally center content */
    padding: 10px 20px;
    border: 2px solid #F0F0F0; /* Light gray border */
    border-radius: 5px;
    background-color: #FFFFFF; /* White background */
    color: #434343;            /* Dark gray font color */
    font-size: 16px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    width: 220px;  /* Fixed width for all buttons */
    height: 60px;  /* Fixed height for all buttons */
    line-height: 1.2; /* Adjust line height for tighter line spacing */
    transition: background-color 0.3s, border-color 0.3s, color 0.3s;
}

.clickable-button:hover, .clickable-div:hover {
    background-color: #9C8CFF; /* Change background color on hover */
    border-color: #9C8CFF;     /* Change border color on hover */
    color: #FFFFFF;            /* Change text color to white on hover */
}

.clickable-button:active, .clickable-div:active {
    background-color: #5E44FF; /* Darker background when clicked */
    border-color: #5E44FF;     /* Match the border color with the background */
    transform: scale(0.98);    /* Slightly shrink the button to simulate a press */
}


Deployment Options

Deployment Requirements

Community

Blog

Encord

Platform Documentation

SDK Documentation

End-to-end Examples

Release Notes

Dashboard