# Aspect Ratio components

> Maintain perfect layouts using 10 aspect ratio React components, optimized for Tailwind CSS and Next.js environments.

15 components available. Showing all of them below.

- [Aspect Ratio](https://21st.dev/@shadcn/components/aspect-ratio.md) — by shadcn
- [Astryx Aspect Ratio](https://21st.dev/@Astryxdesign/components/astryx-aspect-ratio.md) — by Astryx
- [Astryx Aspect Ratio](https://21st.dev/@Astryxdesign/components/astryx-aspect-ratio/image-gallery.md) — by Astryx
- [Astryx Aspect Ratio](https://21st.dev/@Astryxdesign/components/astryx-aspect-ratio/circle-image.md) — by Astryx
- [Astryx Aspect Ratio](https://21st.dev/@Astryxdesign/components/astryx-aspect-ratio/widescreen.md) — by Astryx
- [Astryx Aspect Ratio](https://21st.dev/@Astryxdesign/components/astryx-aspect-ratio/square-image.md) — by Astryx
- [Astryx Aspect Ratio](https://21st.dev/@Astryxdesign/components/astryx-aspect-ratio/with-skeleton.md) — by Astryx
- [Aspect Ratio](https://21st.dev/@olivier_1b6cd5bc/components/aspect-ratio-1.md) — by Olivier Tassinari
- [Image Crop](https://21st.dev/@originui/components/image-crop/image-cropper-1.md) — by Origin UI
- [Lazy Image](https://21st.dev/@sshahaider/components/lazy-image.md) — by Efferd
- [Image Cropper](https://21st.dev/@ruixen.ui/components/image-cropper.md) — by Ruixen UI
- [Framer Moveable Thumbnails](https://21st.dev/@uilayout.contact/components/framer-moveable-thumbnails.md) — by UI Layouts
- [YouTube Embed](https://21st.dev/@inference-sh/components/youtube-embed.md) — by inference.sh
- [Image Crop](https://21st.dev/@haydenbleasel/components/image-crop.md) — by Hayden Bleasel
- [Slide Image](https://21st.dev/@slide-cn/components/slide-image.md) — by Slide-CN

Full component directory: https://21st.dev/llms.txt