UI Customization

Step 1: To customize the UI. On the project page, go to settings where you can set if you wish to use CDN, scoped CSS.

Step 2: To change the themes, you can choose the light theme and the dark theme, or create your own.

Step 3: Click on the Save button to go to the generated UI page.

Step 4: Here you see the new light theme is applied, click on the light/dark theme switcher to view the dark theme.

Step 5: At any time, you can change your project themes.

Step 6: Click Extra JS CSS Code Tab to add extra code.

Step 7: Add the external code or your external links, exactly as you add to your HTML pages.

Step 8: Click on the Update button to view the changes.

Step 9: Now the red colour on body elements is applied.

Step 10: Click the Code Replacements tab to replace a part of the code, add both you want to replace and the replacement.

Step 11: Click the Add New button, then refresh the generated UI code to see the changes.

Step 12: Here is the result of the code replacement we applied, you can add as many code replacements as you need.