The CSS Container Query Generator helps you visually create @container responsive style rules.
CSS container query (@container) is a CSS feature that allows styling based on the size of a parent container rather than the viewport. It enables component-level responsive design.
Yes, completely free to use with no registration or login required.
CSS container queries are supported in Chrome 105+, Firefox 110+, Safari 16+, and other modern browsers. Provide @media query fallbacks for older browsers.
No. All processing happens in your browser. Data is never uploaded to any server.
inline-size means the container can be queried in the inline direction (usually width), while size means both width and height can be queried. Most layouts only need inline-size.