Mimecast Logo
M365 Threat Scan Get a Quote

    How To Create A BIMI SVG Logo

    Find out what the BIMI requirements are and how to create a valid SVG file.
    DMARC Free Trial
    How To Create A BIMI SVG Logo
    DMARC Free Trial
    Overview

    Create a BIMI logo that meets all requirements

    The BIMI logo must meet a number of requirements before it can be displayed in the inbox. If the logo does not meet those requirements, it may not be shown. Read on and find out what the BIMI requirements are and how to create a valid SVG file.

    Please note, the BIMI Working Group is the authority on defining the specifications. The requirements and ‘how-to’ below may be subject to updates/change.


    BIMI Logo requirements

    • Make sure the logo is vector-based. Files with the extension: PDF, Ai SVG or EPS are often vector-based files. If in doubt, please contact the designer.
    • Format: SVG Tiny 1.2
    • Logo dimensions: square
    • The BIMI logo must be published on a domain with an SSL Certificate in place (https)

     

    How to create a validated BIMI SVG file

    Go through the steps below and create a SVG file which can be used for the BIMI record.

    1. Open the vector-based file in Adobe Illustrator
    2. Save the file as (file > Save as…)

      Choose SVG (not: svgz) | Avoid uppercase letters, spaces, underscores, or strange characters in the file name. Keep it simple. For example: brand-name-bimi.svg

    3. Save the file with the following settings

      Settings: SVG Profiles: SVG Tiny 1.2 | Image location: Preserve

    4. Open the just created SVG file in a code/text editor

      If no code editor is available, open the standard available software. For example: TextEdit (Mac) or Notepad (Windows)

    5. On line 3: Change the base Profile from “tiny” to “tiny-ps”

      Change the Baseprofile

    6. On line 3: Remove the x/y attributes

      If the SVG tag (<svg…) contains the x/y attributes (for example: x=”0” y=”0”), remove these attributes.
      Remove coordinates SVG file 

    7. Add a title on line 4 
      After the <svg… and before the <g> tag) add <title></title>. Example: <title>Brand name</title> More than 65 characters are not allowed

      Add title to SVG file 

    8. Save the modified (SVG) file

      If the customized SVG file looks similar to this example. The file is ready. BIMI SVG file example

    9. Upload the SVG file to the server for which the BIMI record is also published

       

    Troubleshooting the BIMI SVG file


    Find out if the BIMI logo contains bitmap images

    To find out if a bitmap image has been added, check the SVG file. There are several ways to check the source code of an SVG file. Two are mentioned below:

    1. Save/download the SVG File (option 1)
      1. Open the SVG file in TextEdit (Mac) or Notepad (Windows)
    2. Open the SVG file in Google Chrome (option 2)
      1. View the source code (view > developer > source code)
    3. After the source code is visible, search for: img/ 

    If the search returns a result it can be assumed that the SVG file contains a bitmap image and therefore does not match the guidelines of the BIMI logo.

    Example:
    When the next line (file.Xlink:href=”data:img/png;base64, i) is found, the SVG file contains a reference to a PNG (Bitmap).

    Solution
    Ask the designer of the logo to modify the file so that it is a fully vector-based file.


    Large SVG files without bitmap images

    It is possible that the SVG file was created in a different way and therefore contains more (unnecessary) code.

    Solution
    In that case open the SVG file in Adobe Illustrator and follow the steps mentioned above. This will create a well encoded SVG file.

    Additional resources

    Related How To Create A BIMI SVG Logo Resources

    Back to Top