PHI · PLACEHOLDER IMAGES

A real image.
A better starting point.

Bring your layouts to life with placeholder images. Choose a size, a subject and a color. Then drop the URL into your code.

Build an image URL ↓Explore PHI ↗

Images via URL · No API key · Made for web creators

ONE URL. YOUR NEXT LAYOUT./phi/interior_w-620_h-430.jpg

LESS FILLER. MORE CHARACTER.

Build around images that fit.

01 / SIZE

Made for your layout

Set width and height directly in the URL. Use a wide image for a hero, a square for a card or a portrait for a narrow column.

02 / SUBJECT

A little more relevant

Filter the catalog with keywords such as interior, nature or business. Pick a color to bring the result closer to your design.

03 / WORKFLOW

From URL to interface

Use the image URL in an img tag or browse PHI's gallery to find a specific image and prepare your own crop.

TRY PHI

Your next placeholder, ready to paste.

Choose your settings and generate a live preview.

Your image URL

Open image ↗

A FEW POSSIBILITIES

Different spaces. One simple pattern.

A wide hero

Give the top of your page a little breathing room.

/phi/landscape_w-1000_h-500.jpg

A square card

Try a consistent shape across your content grid.

/phi/abstract_w-600_h-600.jpg

Portrait placeholder with a green color filter

A color-led portrait

Explore a taller crop with a green color filter.

/phi/color-green_w-600_h-800.jpg

DOCUMENTATION

A URL you can read and change.

https://phi.4asuite.com/phi/interior_color-blue_w-900_h-550.jpg

Join parameters with underscores inside the /phi/ path.
Parameter	Example	What it does
Keyword	`interior`	Filters by subject.
Color	`color-blue`	Filters by color.
Width / height	`w-900_h-550`	Sets output dimensions, up to 1024 pixels.
Aspect ratio	`ratio-16-9`	Requests a particular shape.
Image ID	`/phi/{public_id}.jpg`	Uses a specific catalog image.
Metadata	`?json=1`	Returns image metadata instead of an image.

Filtered URLs select an image from the catalog. For a specific image, use its public ID from the PHI gallery.

Explore the full documentation on PHI ↗

READY FOR YOUR NEXT MOCKUP

Put an image in the picture.

Browse the catalog, prepare a crop and bring it into your layout.

Open PHI ↗

A real image.A better starting point.