← Back to functions

CSS Function

env()

Variables

Inserts the value of a user-agent environment variable, like safe area insets on mobile.

Syntax

env(variable, fallback)

Example

padding-bottom: env(safe-area-inset-bottom, 1rem);

Common use cases

  • Avoiding the iPhone notch and home indicator
  • Safe area padding for PWAs
  • Full-screen web app layouts on mobile

Practical developer insight

env(safe-area-inset-*) is essential for PWAs and full-screen mobile apps — without it, content gets hidden behind the notch or home indicator on iOS.

Related

var()calc()padding