Logo and Website Title
How to change the Logo and the Website Title of react refine, i am using material UI with vite
2 Replies
Hi @George Mohsen. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
To change the logo and title in your Refine project, you can use the
AuthPage
and ThemedTitle
components.
For the title, you can use the title
prop of the AuthPage
component. By default, the title is "Refine Project". You can change it by passing a new title to the title
prop. Here's an example:
You can also customize the title with the ThemedTitle
component:
In the above example, replace "My New Title"
with your desired title and "<https://refine.dev/img/logo.png"
> with the URL of your logo.
For the logo, you can use the icon
prop of the ThemedTitle
component. By default, the icon is the Refine logo. You can change it by passing a new icon to the icon
prop. Here's an example:
In the above example, replace MyLargeIcon
and MySmallIcon
with your desired icons.
Please note that these examples are for Material-UI. If you're using a different UI library, you might need to adjust the code accordingly.
For more information, you can refer to the following documentation pages:
- AuthPage component (https://refine.dev/docs/ui-integrations/material-ui/components/auth-page#title)
- ThemedTitle component (https://refine.dev/docs/ui-integrations/material-ui/components/themed-layout#title)
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1083046721392750612> kapa.ai is still learning and improving, please let us know how it did by reacting below