Sass Initials

Examples with two initials

data-initials="cw"


Examples with 1 initial in different sizes

data-initials="a"

Sizing example {{ size }}

data-size="{{ size }}"


Responsive example with multiple breakpoints

Configure breakpoints and sizes in .scss 
            
.html:
data-size="fluid"

// or

data-size="fluid xs"
data-size="fluid sm" // etc...

.scss:            
// breakpoint + size
$initials-sizes-fluid:   400px  20px,
                         700px  35px,
                         900px  75px,
                         1200px 100px;