Drupal - Use SVG file for your logo

By xngo on February 25, 2019


A website logo should be simple. It should be visually appealing when it is in different sizes: 64x64, 32x32 and 16x16 pixels. Often time, the logo is beautiful when it is big but unrecognizable when you shrink it to the browser tab height, i.e 16x16 pixels. Therefore, a logo should have less demarcations and colors.

Use SVG file for your logo

Using SVG file for your logo is the best. The quality of your logo will not be affected when users zoom in or zoom out. In Drupal, from the UI, you can't upload a SVG logo file. The only allowed file formats are: png, jpeg, jpg and gif. What you can do is to manually overwrite /themes/YOUR_THEME/logo.svg with yours.

Don't forget to change /themes/YOUR_THEME/favicon.ico too. It is the icon shown on the browser tab. You can use ImageMagick to convert your image to favicon.ico. You can find the conversion command here.

Recommend read

About the author

Xuan Ngo is the founder of OpenWritings.net. He currently lives in Montreal, Canada. He loves to write about programming and open source subjects.