Pixel
The smallest unit of a digital display, a single point of color that combines with millions of others to form images. Understanding pixel dimensions helps you provide appropriate image sizes for different devices. Retina displays pack more pixels into the same space, requiring higher-resolution images for sharp display.
Border Radius
Design
The CSS property that rounds the corners of an element, measured in pixels or percentages. Border radius transforms harsh rectangles into friendlier, more organic shapes—from subtle rounding to perfect circles. Framer provides individual corner controls for asymmetric rounding and variables to maintain consistent corner radii across your design system.
Favicon
SEO
The small icon displayed in browser tabs, bookmarks, and mobile home screens, typically 16x16 or 32x32 pixels. A distinctive favicon helps users identify your site among many open tabs and reinforces brand recognition. Upload favicons in Framer's site settings—consider how your icon reads at very small sizes.
Open Graph
SEO
A protocol that controls how pages appear when shared on social platforms like Facebook, Twitter, and LinkedIn. Open Graph tags specify titles, descriptions, and images for consistent, attractive social shares SEO settings with compelling images sized 1200x630 pixels.
SVG
Media
Scalable Vector Graphics—an image format using mathematical paths instead of pixels, staying crisp at any size. SVGs are perfect for logos, icons, and illustrations that need to scale across different screen sizes and densities. Framer supports SVG import and handles them optimally for web delivery.
Retina Display
Media
High-resolution screens with twice or more the standard pixel density, displaying sharper text and images. Retina displays require higher resolution images—typically 2x the displayed size—to appear crisp. Framer automatically serves appropriate image sizes for different display densities.
DPI
Media
Dots Per Inch—a measure of print resolution indicating how many ink dots fit in one inch, affecting print quality and file size. Higher DPI produces sharper prints but larger files. For web, focus on PPI (pixels per inch) and responsive images rather than DPI.
PPI
Media
Pixels Per Inch—a measure of screen resolution indicating pixel density, with higher values producing sharper displays. Understanding PPI helps prepare appropriate image resolutions for different device types. Design at 1x and provide 2x assets for retina and high-DPI screens.
Raster Graphics
Media
Images composed of pixels in a fixed grid, ideal for photographs but losing quality when enlarged beyond original size. Raster formats like JPEG and PNG are standard for photographs and complex imagery. Use appropriate resolutions and compression for web delivery.
Meta Pixel
Analytics
Meta’s tracking script used to measure site actions, build custom audiences, and optimize ad campaigns. It is typically installed on pages and configured to send conversion and event data.
Generative Fill
AI
Generative Fill replaces or creates content inside selected areas while matching surrounding context. It often depends on accurate Image Segmentation and pairs with Generative Expand for broader canvas edits.