🖥️ Display the Sign in with Trusted button

Trusted Accounts provides downloadable logo artwork you can use to create custom Verify with Trusted buttons that display either a logo only or a logo and text. The logo files are available in PNG, and SVG formats and the artwork for both types of buttons includes both black and white versions.

The Trusted button

HTML

<button class="trusted-button">
    <div class="trusted-button-inner">
        <img src="/img/Trusted_Icon_White.svg" />
        <p class="trusted-button-text">Verify with Trusted</p>
    </div>
</button> 

CSS

@import url('https://fonts.googleapis.com/css2?family=Epilogue:wght@600&display=swap');

.trusted-button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0px 24px;

    width: 270px;
    height: 50px;

    background: #2E31FF;
    border-radius: 4px;
    border: none;
}

.trusted-button-inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 8px;
}

.trusted-button-text {
    font-family: Epilogue;
    font-weight: 600;
    font-size: 16px;
    color: white;
    padding: 4px 0px 0px;
    margin: 0px;
}

And here is what the button will look like. See the section Understand personalized button to see the different variants of the Trusted button to match the UX of your platform.