Box Sizing Tool
Visualize differences between content-box and border-box
Box Model Settings
Configure box sizing and dimensions
Calculated Dimensions:
Total Width: 200px
Total Height: 150px
Content Width: 150px
Content Height: 100px
Live Preview
See box-sizing behavior in action
border-box
200 × 150
Generated Box Sizing Code
.box-sizing {
box-sizing: border-box;
width: 200px;
height: 150px;
padding: 20px;
border: 5px solid #3b82f6;
}