4:5 social media portrait aspect ratio

<script setup lang="ts">
import { AspectRatio } from "@/components/ui/aspect-ratio"

const PIXEL =
  "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs="
</script>

<template>
  <div class="w-full max-w-xs">
    <AspectRatio :ratio="4 / 5" class="bg-muted rounded-xl overflow-hidden border">
      <img :src="PIXEL" alt="4:5" width="1000" height="800" class="h-full w-full object-cover" />
    </AspectRatio>
  </div>
</template>