Tips & Guides

Use a sharp image with strong contrast between the subject and background. Even lighting, a plain backdrop, and clear edges usually produce the cleanest result.

• Avoid heavy shadows touching the subject.
• Keep hair, fur, glass, and transparent objects against a contrasting background.
• Use the highest-quality original instead of a screenshot when possible.

Background removal separates a main subject from everything behind it. Object removal is better for small distractions inside an image—such as a blemish, bird, dust spot, baked-in button, or unwanted corner object.

JPG files cannot store transparency. Export as PNG or WebP with transparency enabled, and make sure the app or website displaying the file supports transparent backgrounds.

• PNG: transparency, logos, clip art, and crisp graphics.
• WebP: smaller website images with good quality and optional transparency.
• JPG: photographs where transparency is not needed.
• SVG: true vector artwork that must scale cleanly.

PNG clip art is made from pixels, so enlarging it far beyond its original dimensions stretches those pixels and softens the edges. Start with the largest available file, resize from the original, and avoid repeatedly saving and enlarging the same copy.

Confirm that the image is large enough for the intended print size, the transparent background is still intact, and important details are not too close to the edges. Always make a small test print before producing multiple copies or a large transfer.

A PNG is made from pixels. An SVG is made from vector paths and shapes, so a properly built SVG can grow or shrink without becoming blurry.

Simple, high-contrast artwork with clean edges converts best. Photos, soft shadows, gradients, textures, and tiny details usually create many rough paths and a larger file.

• Fill: the color inside a shape.
• Stroke: the outline around a shape.
• Path: the instructions that draw a vector shape.
• viewBox: the SVG’s internal drawing area and coordinate system.

They may use different viewBox sizes, path structures, stroke widths, transforms, or grouped elements. Those hidden differences affect editing, animation, scaling, and how the SVG behaves inside other tools.

Copy the SVG markup when you want to paste it directly into HTML or edit the code. Download the file when you want a reusable asset for an editor, project folder, converter, or upload field.

Font converters work most reliably with simple monochrome paths. Extra backgrounds, embedded images, masks, filters, strokes, or complicated transforms can create missing, filled, or distorted glyphs. A clean path-only SVG gives the converter a clearer shape to map.

• Sound effect: a short action sound such as a click, pop, error, or swoosh.
• Loop: audio designed to repeat continuously.
• Soundscape: a longer atmospheric scene or mood that may also loop.

Trim at a natural musical or ambient boundary, match the beginning and ending energy, and use a short crossfade when appropriate. Repeated playback is the real test—listen through the transition several times.

• WAV: high-quality editing master with a larger file size.
• MP3: broadly compatible and convenient for sharing.
• OGG: efficient for websites, browser tools, and many games.

Lossy formats reduce data to make files smaller. Repeatedly converting a compressed file can add artifacts, so keep an original high-quality master and make new exports from that source.

Sound effects marked by the black ribbon are free to use without attribution. Loops and music use the blue ribbon and require attribution. Check the access legend on the vault before downloading so you know which rule applies.

An icon font stores symbols in font glyph slots and is commonly used through CSS classes or a character picker. A key font maps artwork to normal keyboard characters, so pressing a mapped letter, number, or symbol types that design.

Icon fonts are useful when a website or app needs many matching monochrome symbols that should share one font file and be controlled with CSS. Separate SVGs are often better when icons need multiple colors, detailed editing, or independent animation.

The stylesheet loads the font, connects readable class names to each mapped glyph, and makes the icons easier to place in a website without remembering private Unicode values. Keep the TTF and CSS paths together when moving the pack into a project.

Use plain letters, numbers, hyphens, and underscores when naming font files and glyphs. Apostrophes, decorative punctuation, emojis, and unusual symbols can break downloads, CSS class names, shell commands, or font compilation even when the artwork itself is valid.

Browsers, design programs, and operating systems may cache an older font with the same internal name. Remove the old installed version, close and reopen the program, or give the updated font a new clean version name before testing again.

File size, dimensions, encoding, browser memory, device power, and the complexity of the source all matter. A very large image, long video, or complicated SVG can take longer or exceed what a phone browser can comfortably process.

Use the original whenever possible. Screenshots may reduce resolution, flatten transparency, add compression, crop metadata, or change the color profile.

Every source file behaves differently. Previewing helps catch rough edges, incorrect transparency, unwanted cropping, distorted audio, missing metadata, or settings that need one more adjustment.

Save a copy of the original, close unnecessary browser tabs, use a desktop when available, and reduce oversized dimensions only when the project does not require them. Never overwrite your only master file.