---

Frakto CSS Order

Frakto CSS Order is a thoughtfully crafted guide to ordering CSS properties based on logical grouping, real-world usage, and the browser’s rendering flow. Instead of relying on arbitrary or alphabetical sorting, this structure prioritizes readability, maintainability, and performance — helping developers write cleaner, faster, and more intuitive stylesheets.

Why

Most CSS sorters follow alphabetical, SMACSS, or arbitrary schemes. frakto-css-order redefines that. It's crafted around:

• Rendering Tree Logic – Inspired by how browsers parse and apply styles.
• Developer Experience – Easier to read, write, and maintain.
• Compression Efficiency – Related properties stay together, reducing redundancy.

Categories

1. Positioning

Defines the spatial placement of elements in the document flow, including stacking context, offsets, and flow disruptions.

2. Box Model

Controls the physical dimensions of elements, including sizing, padding, and margins — everything that affects how a box occupies space.

3. Layout

Manages how child elements are arranged within a parent, including layout systems like Flexbox, Grid, and multi-column flows.

4. Typography

Handles everything related to text: font settings, spacing, alignment, rendering, punctuation, and writing direction.

5. Visual

Affects the visual appearance of elements — background, borders, shadows, opacity, masks, and visibility. This is what users "see".

6. Transform

Covers transforms, transitions, and animations — any visual changes over time or space, including scaling, rotation, and motion.

7. Interaction

Defines how elements respond to user interaction and device input. Includes scroll behavior, pointer interaction, selection, and overflow.

8. Miscellaneous

A catch-all category for properties that don't fit elsewhere — including counters, content injection, printing, and global resets.

Contributing

Contributions are welcome and encouraged.
If you'd like to help improve this plugin, please open a pull request or issue.

Make sure to follow our contributing guidelines before submitting any changes.

License

MIT License — Copyright © 2025 Frakto

Support this project

This project is maintained with love and dedication. If you find it helpful, please consider: