• Documentation
  • Components
  • Blocks
Getting Started
  • Introduction
  • Principles
  • Setup
  • AI Skills
  • Dark Mode
  • Migration Guide
Design System
  • Theming Tokens
  • Color Tokens
  • Buttons
  • UI Utilities & Variants
General & Navigation
  • Button
  • Link
  • Breadcrumbs
  • Toggle
  • Toggle Group
  • Search Field
  • File trigger
Form Inputs
  • Input
  • Number Field
  • Input OTP
  • Input Date
  • Input Time
  • Select
  • Checkbox
  • Radio
  • Combobox
  • Multi Select
  • Switch
  • Tag Field
  • Slider
  • Tabs
Date & Time
  • Calendar
  • Range Calendar
  • Date Picker
  • Date Range Picker
Data Feedback
  • Table
  • Alert
  • Avatar
  • Badge
  • Callout
  • Card
  • Progress Bar
  • Loader
  • Progress Bar Circle
  • Skeleton
  • Aspect Ratio
  • Keyboard
  • Separator
  • Native Table
  • Tag Group
Drag & Drop
  • Drag And Drop
Overlays & Disclosure
  • Dialog
  • Modal
  • Sheet
  • Popover
  • Disclosure
  • Disclosure Group
  • Menu
Layout & Structure
  • Sidebar
  • Navbar
Visualizations
  • Chart
  • Area Chart
  • Bar Chart
  • Line Chart
  • Pie Chart
  • Tracker
Typography
  • Heading
  • Icon
  • Text
  1. Components
  2. Aspect-ratio

Aspect Ratio

Set the aspect ratio of a container using CSS.

Flexiwind

Demo

Image by Johnnathan Tshibangu

Installation

terminal

Examples

Standard TV

Image by Johnnathan Tshibangu

Square

Image by Johnnathan Tshibangu

Ultra Wide

Image by Johnnathan Tshibangu

MM Film

Image by Johnnathan Tshibangu
Edit this page
Prev
Keyboard

Display keyboard shortcuts and key combos.

Next
On this page
  1. Demo
  2. Installation
  3. Examples
    1. Standard TV
    2. Square
    3. Ultra Wide
    4. MM Film

Community

  1. Contributing
  2. Edit this page
  3. Star On github
Published under MIT License
    DemoBlocksTemplatesClub
Copyright © jk-ui 2026. Designed By Johnkat MJ.