HTML to LESS and SCSS

Orso is an HTML analyzer that generates template code with a set of LESS and SCSS (Sass 3) simple nested empty rules based on the submitted markup.

Submit your HTML document (< 250kB):

indent

note: it does not store your data or the generated code.

example output: with this very (humble) page, it renders
// scaffolding

div {
    div {
        small {
            a {
            }
        }
    }
    div.example {
        em {
        }
        pre {
        }
    }
    form.fixed {
        input {
        }
        label {
            input {
            }
        }
        p {
            em {
            }
        }
        strong {
        }
    }
    h1 {
    }
    h3 {
    }
    p {
        a {
        }
    }
    p.fixed {
    }
    ul {
        li {
            a {
                strong {
                }
            }
            em {
            }
        }
    }
}


// IDs

#footer {
    small {
    }
}

#wrapper {
    div {
        &.example {
        }
    }
    form {
        &.fixed {
        }
    }
    h1 {
    }
    h3 {
    }
    p {
        &.fixed {
        }
    }
    ul {
    }
}


// classes

.example {
    em {
    }
    pre {
    }
}

.fixed {
    input {
    }
    label {
    }
    p {
    }
    strong {
    }
}

It's something more than a proof of concept prototype inspired by Bear CSS.

NEW FEATURES

FAQ