Accessing an array key in SASS

Question

I have a list in SASS, and I\'m trying to access on of the items by using bracket notation:

$collection[1];

but that gives me an error.

Answer 1

$color-collection: ('red', 'orange', 'green', 'blue');

@for $i from 0 to length($color-collection) {
    .color-#{$i} {
        color: unquote(nth($color-collection, $i+1));
    }
}

Use nth(), also unquote() if you want to pass quoted strings.

Though, I personally wouldn't:

$color-collection: (red, rgba(50,50,80, .5), darken(green, 50%), rgba(blue, .5));

@for $i from 0 to length($color-collection) {
    .color-#{$i} {
        color: nth($color-collection, $i+1);
    }
}

Because then you can pass any color object.