1024px to VW Conversion Table
Tablet design · iPad landscape and small-laptop width, the boundary between tablet and desktop. Convert live with the calculator below or look values up in the table.
px → vw table for a 1024px base
Formula: vw = px ÷ 1024 × 100 · 1px = 0.0977vw · 1vw = 10.24px
| px | vw |
|---|---|
| 1px | 0.098vw |
| 2px | 0.195vw |
| 4px | 0.391vw |
| 6px | 0.586vw |
| 8px | 0.781vw |
| 10px | 0.977vw |
| 12px | 1.172vw |
| 13px | 1.27vw |
| 14px | 1.367vw |
| 15px | 1.465vw |
| 16px | 1.563vw |
| 17px | 1.66vw |
| 18px | 1.758vw |
| 20px | 1.953vw |
| 22px | 2.148vw |
| 24px | 2.344vw |
| 26px | 2.539vw |
| 28px | 2.734vw |
| px | vw |
|---|---|
| 30px | 2.93vw |
| 32px | 3.125vw |
| 36px | 3.516vw |
| 40px | 3.906vw |
| 44px | 4.297vw |
| 48px | 4.688vw |
| 50px | 4.883vw |
| 56px | 5.469vw |
| 60px | 5.859vw |
| 64px | 6.25vw |
| 72px | 7.031vw |
| 80px | 7.813vw |
| 90px | 8.789vw |
| 96px | 9.375vw |
| 100px | 9.766vw |
| 120px | 11.719vw |
| 140px | 13.672vw |
| 160px | 15.625vw |
| px | vw |
|---|---|
| 180px | 17.578vw |
| 200px | 19.531vw |
| 240px | 23.438vw |
| 280px | 27.344vw |
| 300px | 29.297vw |
| 320px | 31.25vw |
| 360px | 35.156vw |
| 400px | 39.063vw |
| 480px | 46.875vw |
| 500px | 48.828vw |
| 600px | 58.594vw |
| 640px | 62.5vw |
| 720px | 70.313vw |
| 800px | 78.125vw |
| 960px | 93.75vw |
| 1000px | 97.656vw |
| 1200px | 117.188vw |
Batch CSS converter
Paste CSS and every value converts instantly. @media conditions are left untouched.
Calculate in SCSS or CSS
Functions with your base width baked in. Paste them into your project.
SCSS
CSS
vw → px table for a 1024px base
| vw | px |
|---|---|
| 0.1vw | 1.02px |
| 0.25vw | 2.56px |
| 0.5vw | 5.12px |
| 0.75vw | 7.68px |
| 1vw | 10.24px |
| 1.25vw | 12.8px |
| 1.5vw | 15.36px |
| 2vw | 20.48px |
| 2.5vw | 25.6px |
| vw | px |
|---|---|
| 3vw | 30.72px |
| 4vw | 40.96px |
| 5vw | 51.2px |
| 6vw | 61.44px |
| 7.5vw | 76.8px |
| 8vw | 81.92px |
| 10vw | 102.4px |
| 12.5vw | 128px |
| vw | px |
|---|---|
| 15vw | 153.6px |
| 20vw | 204.8px |
| 25vw | 256px |
| 30vw | 307.2px |
| 40vw | 409.6px |
| 50vw | 512px |
| 75vw | 768px |
| 100vw | 1024px |
How does it look on other screens?
What the vw values from a 1024px design render as, in px, on other viewport widths.
| Design value | vw | 768px screen | 820px screen |
|---|---|---|---|
| 12px | 1.172vw | 9px | 9.6px |
| 14px | 1.367vw | 10.5px | 11.2px |
| 16px | 1.563vw | 12px | 12.8px |
| 20px | 1.953vw | 15px | 16px |
| 24px | 2.344vw | 18px | 19.2px |
| 32px | 3.125vw | 24px | 25.6px |
| 48px | 4.688vw | 36px | 38.4px |
| 64px | 6.25vw | 48px | 51.3px |
Frequently asked questions
How many vw is 16px on a 1024px base?
(16 ÷ 1024) × 100 = 1.5625vw. Rounded to two decimals that is 1.56vw.
How many px is 1vw on a 1024px screen?
On a 1024px-wide screen 1vw is 1% of the width, i.e. 10.24px. Conversely, 1px is 0.0977vw.
What happens to a 1024px design converted to vw on other screens?
vw scales with the viewport width, so 16px (1.563vw) from a 1024px design renders as 12px on a 768px screen, 12.8px on a 820px screen. Use clamp() to set minimum and maximum sizes so values never get too small or too large.