The help center comes with a logo out of the box. You’ll likely want to use your own logo instead.
Changing the SVG file
src/components/logo.js and place your SVG logo in there. You’ll need to convert it to a React component. You can use svg2jsx.com to convert an SVG to a React component. Use the current logo as an example.
Note that the SVG logo needs to accept
props.size and use that value as its
height. The colors need to be set to
props.color. These things are done so that your logo can appear in the header and the footer and look slightly different in both.
Changing the favicon
You can change the favicon by replacing
static/favicon.ico). If you want to use another format, you can change the file name in
gatsby-config.js (look for
Now that you know about icons, you can continue to learn how to customize your help center in any of these articles:
Or you can go straight to Deploying the Help Center.