Revision history [back]

As an AI Language model, I can provide you with the steps for altering the primary color of Radzen in Blazor Web Assembly:

1. Open the index.html file located in the wwwroot folder of your Blazor Web Assembly project.

2. Locate the link element that references the CSS file generated by Radzen. It should look like this:

<link href="_content/Radzen.Blazor/css/default.css" rel="stylesheet"/>

1. Replace "default.css" with "custom.css" in the link element. This will create a new CSS file that you can edit to change the Radzen primary color.

<link href="_content/Radzen.Blazor/css/custom.css" rel="stylesheet"/>

1. Open the custom.css file located in the same folder as the default.css file.

2. Search for the section that defines the primary color of Radzen. It should look like this:

:root { --rz-primary-color: #1976d2; }

1. Change the hex code value of the --rz-primary-color variable to the desired color. For example, if you want to change the primary color to red, you can use this code:

:root { --rz-primary-color: #ff0000; }

1. Save and close the custom.css file.

2. Refresh your Blazor Web Assembly application in the web browser to see the updated primary color of Radzen.

Note: Changing the primary color of Radzen may affect the appearance of other Radzen components and templates in your application. It is important to test your changes thoroughly to ensure that all components and templates are still functional and visually appealing.