Hi everyone! I hope you all are doing great! I am new on Descope, I have implemented it as an IdP for a Salesforce Community, it is working fine, but now the client wants a more customized login page, similar to the image attached. They want fields with effects, transparent SSO buttons horizontally aligned, the container to be transparent, and the option to remember the user and forgot password link. I could apply only some of these changes using the descope console but the result is still away from the desired. I read that I could use the React SDK for this but the examples I found are basically embedding the flow so I ended having the same UI limitations. Could you please provide some ideas/documentation of how to reach the desired level of customization? Thanks in advance.

Hey @Adonay Palacios! Welcome to Descope 👋 For the level of pixel-perfect UI you’re aiming for (transparent container, custom input effects, horizontal/transparent SSO buttons, remember-me, etc.), you generally have two paths: • If you want to stay on hosted/Flow screens: use the Console Styles & Themes (including Code Mode) to apply advanced styling and custom CSS-like overrides. Docs: https://docs.descope.com/management/styles and examples here: https://docs.descope.com/management/styles/advanced-styling-examples • If you need full control over layout/animations beyond what hosted screens allow, use BYOS (Bring Your Own Screen) so you build the UI yourself while keeping Descope flow logic. Docs: https://docs.descope.com/flows/screens/byos (there’s also a sample app: https://github.com/descope-sample-apps/byos-sample-app)

Hi Adonay, what do you mean by transparent sso button?

Thank you so much for sharing that documentation @Nick Rodriguez! I was able to replicate the UI in React and the authentication seems to be working fine for OTP. I need to figure out how to configure the new app with Salesforce though.

this screen is fully built with our UI. I’m pretty sure everything is doable - except the checkbox color.

When I put transparent as the color of the form container, it always shows the form with color, I don't see options to update the field border, and any option for the button alignment and size. I tried from the Descope Console, do you know any other way @Yarden Dassa?

the root container should be 0%

This is great!! I was looking in the wrong place then. Thank you so much @Yarden Dassa