Hello World: Welcome to css2logical

Welcome to css2logical! We're excited to launch this simple yet powerful tool designed to help developers modernize their CSS.

What is css2logical?

css2logical is a free, browser-based tool that converts traditional CSS physical properties to their logical equivalents. Simply paste your CSS code, click convert, and get internationalization-ready styles instantly.

Why Logical Properties?

CSS Logical Properties are a game-changer for building truly international websites. Instead of thinking in terms of "left" and "right", you think in terms of "start" and "end" — which automatically adapts to different writing directions.

For example:

/* Physical (old way) */
margin-left: 20px;
padding-right: 16px;
border-top-left-radius: 8px;

/* Logical (new way) */
margin-inline-start: 20px;
padding-inline-end: 16px;
border-start-start-radius: 8px;

When your site is viewed in a right-to-left language like Arabic or Hebrew, the logical properties automatically flip to maintain the correct visual flow.

Features

• Instant conversion — Paste, click, copy
• Diff view — See exactly what changed, git-style
• Privacy first — All processing happens in your browser
• Dark mode — Easy on the eyes

What's Next?

We have exciting plans for css2logical:

• Support for more CSS properties
• VS Code extension
• CLI tool for build pipelines
• Tailwind CSS class conversion

Stay tuned for more updates. Happy coding!