Guidelines

BRAND

BFSUAPA Brand Guidelines

Choose and download the logo that fits the job, check proportions, background and clear space, then prepare files for web, print and merchandise as the final product requires.

Choose the logo file that fits the job

When making a poster, a WeChat cover image, a web page or merchandise, decide on the shape of the finished piece and its background first, then choose one of the existing logos. Use the original file and keep its proportions; do not crop the logo from a screenshot, redraw it or change its colours.

AssetSizeSuggested use
Horizontal mark, transparent640×360Horizontal areas on light backgrounds; keeps the transparent background
Horizontal mark, white background640×360Documents and horizontal material that need a white background
Square logo640×640Profile pictures and square display areas; preview the platform's crop
Header mark160×90Small display in the website header; not for enlarging in print

These are existing bitmap assets. Open a link to save the original file. Before using one in print, check the actual output size and sharpness; if the file is too small, ask the design lead for a suitable source file.

Placing the logo: proportions, background and clear space

Lock the aspect ratio first, then scale the logo to its target position. Leave enough space around the logo to separate it from headings, images and other logos; check the clear space at the final size, not only in an enlarged draft.

Use a clear, clean background. If a photo is too busy, or its colours make the logo hard to recognise, move the logo or add a separate clean background area. Do not place the transparent logo directly on an arbitrary dark background, and do not recolour it to suit a background.

Do not stretch, squash, rotate, or add shadows, outlines, gradients or glows. For black-and-white printing, foil stamping, embroidery or other special processes, get the appropriate version first. The current materials do not settle a minimum size, a clear-space ratio or a complete single-colour version, and this page does not make up those values.

Colour: brand colours versus web text colours

The brand value of BFSUAPA Red is #E14B3F. The seven-continent and four-ocean series are for maps, event visuals and themed material, while black, white and greys carry body text and backgrounds. Decide what the key information is first, then choose supporting colours; there is no need to put the whole palette into one image.

The website already has semantic colour variables: body text, secondary text, links and backgrounds switch with the light and dark themes. Brand red is not a body-text colour that works on any background; colour pairs need their text–background contrast checked. For the full palette, the steps and the checks, see the Colour system.

Type: displays correctly and reads clearly

The website uses the locally hosted Noto font family and picks the matching font for Chinese and other writing systems. When making external material, confirm that the font licence covers the intended use; having a font installed on a computer does not mean it may be used for every finished product.

Headings and body text form a clear hierarchy, and body text does not rely on decorative lettering to carry a lot of information. Chinese is never set in italics. In multilingual material, check for missing glyphs, letter joining and text direction; foreign-language text is not decoration, and translations and names still need verifying. For writing rules, see the Style guide.

From screen design to print or merchandise

  1. Confirm the purpose, finished size, quantity and production method, and get the file format, bleed, colour mode and other requirements from the producer.
  2. Work with assets at the matching size, and check the logo's proportions, the sharpness of the text and the distance between important content and the trim edge.
  3. Export as the producer requires and check that the export matches the source file; on-screen HEX values cannot be used directly as ink or spot-colour numbers.
  4. Where possible, print a proof and check the colours, fine text, edges and real viewing distance before going into production.
  5. Keep the editable source file, the delivered files and a record of the approval, noting the version and purpose.

There are currently no published production specifications for merchandise. The above is a checking method; the finished product follows the approved design and the production requirements.

Quick check before handing off

Confirm that you used the original logo file and its proportions are not distorted; that the background and clear space keep the logo recognisable; that Chinese, foreign-language text and numbers are readable; that the images and fonts may be used for this product; and that the exported file has been checked at its real display or print size.

Look up colour values in the Colour system, web components and interaction in the Design system, or return to all guidelines.

Show the four original logo files
Horizontal mark, transparent
Horizontal mark, transparent · 640×360 · PNGOpen fileDownload
Horizontal mark, white background
Horizontal mark, white background · 640×360 · JPGOpen fileDownload
Square logo
Square logo · 640×640 · JPGOpen fileDownload
Header mark
Header mark · 160×90 · PNGOpen fileDownload