Skip to main
Link
Indoor plants in pots on a floating shelf
held up by brackets.

Sass Indented Syntax Improvements

Bringing SCSS flexibility to .sass files

The Sass indented format is getting more flexible with the ability to have multiline statements, semicolons, and more.

Read the full article »

OddBird is proposing the introduction of parts of SCSS syntax into the indented format. Some highlights:

  1. Baseline Bakery: as sweet as Interop. Demo to view donut products as a small grid, large grid, or list with an optional To Go Bag sidebar.
    Link post type

    Container Queries and Units in Action

    One of the goals when writing CSS is to build component parts that will adapt well to different (and unexpected) contexts. Ideally, a component can be placed inside any “container” element without it feeling broken or out of place. How can you accomplish this in a complex layout like a…

    see all Link posts
  2. A graph showing font size and zoom effectiveness versus viewport width. The font size, calculated as calc(17px + 2.5vw), increases linearly with viewport width. The 500% zoom line, representing the maximum possible zoom, shows that zoom becomes less effective as viewport width increases, failing to provide a 200% font size increase beyond a viewport width of 2040px.
    Link post type

    Responsive and Fluid Typography with Baseline CSS Features

    As designers, it makes sense to think about what space is available in the browser, and adjust your typography accordingly. It’s also important to remember that different users will have different font-size needs – and the more a font size is responsive to the viewport, the less responsive it will…

    see all Link posts
  3. Sass logo in black
on top of bright oklch color gradient
    Link post type

    Sass Color Spaces & Wide Gamut Colors

    Inspect and manipulate the new CSS color formats in Sass!

    CSS has a range of new color functions that support wider color gamuts (like display-p3) and perceptually uniform color adjustments (like oklch). Sass now provides additional tools for working with these new color formats, and converting between them.

    see all Link posts