Skip to content
  • Design
  • Customize with code

Customize designs with code

Kinde gives you the ability to bring your own HTML / CSS and JavaScript to our hosted pages.

For security, your custom code will only be run on a custom domain. These are free to use in Kinde - set up a custom domain.

There are three layers which make up design customization in Kinde:

  • The Kinde widget - This is the ‘form’ that shows on each screen where end users interact, such as where they input and confirm their auth credentials, enter OTPs, etc. You can change the layout and design of widget elements.
  • The page - the page on which the widget appears, includes background colour, images, footer, location of the widget on the page, etc.
  • Copy / translations - the content that appears in and around Kinde widgets, including field labels, headings, button text, etc. You can update content for all the languages you have selected in Kinde.

Image of sign in page as an example of page parts

It’s important to understand how to work with each of these elements, before getting too far along the custom code path. Learn more about:

Code management

Link to this section

Your code for your pages will live in a GitHub repository (other git providers to be supported later). For details see Connect your repo.