New Sass JS API is released
(21 November 2021)

Other recent news...

Microsoft highlights .NET 8 Hardware Intrinsics features
Additional hardware functionality via APIs so the bespoke web apps we develop can take advantage of users' underlying hardware, e.g. WebAssembly support so that core algorithms can...
11 December 2023
Google launches Gemini AI model
Gemini was designed for flexibility, so it can run on everything from data centres to mobile devices. It's been optimized for three different sizes: Ultra, Pro and Nano (for on-dev...
6 December 2023
Apple launches release candidate versions of iOS 17.2 & iPadOS 17.2
Developing and testing our bespoke Apple iOS apps on beta versions of iOS 17.2 & iPadOS 17.2 allows our app developers to confirm that the apps we develop will work as expected...
5 December 2023
New Sass JS API is released
A new JavaScript API is now fully implemented in Dart Sass and ready for our web app development team to try! The new API is designed to be more idiomatic, performant, and usable than the old one.

The new API comes with four new entrypoint functions: compile() and compileAsync() take Sass file paths and return the result of compiling them to CSS, while compileString() and compileStringAsync() take a string of Sass source and compile it to CSS. Unlike the old API, the async functions all return Promise.

Sass (short for syntactically awesome style sheets) is a preprocessor scripting language that is interpreted or compiled into Cascading Style Sheets (CSS). SassScript is the scripting language itself.

Sass consists of two syntaxes. The original syntax, called "the indented syntax," uses a syntax similar to Haml. It uses indentation to separate code blocks and newline characters to separate rules. The newer syntax, "SCSS" (Sassy CSS), uses block formatting like that of CSS. It uses braces to denote code blocks and semicolons to separate rules within a block. The indented syntax and SCSS files are traditionally given the extensions .sass and .scss, respectively.

Sass is the most mature, stable, and powerful CSS extension language in the world used by professional app developers such as New Media Aid.

Sass is a stylesheet language that’s compiled to CSS. It allows our app engineers to use variables, nested rules, mixins, functions, and more, all with a fully CSS-compatible syntax. Sass helps keep large stylesheets well-organized and makes it easy to share design within and across projects.

CSS stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass has features that don't exist in CSS yet like nesting, mixins, inheritance, and other features that help our bespoke app engineers and app developers to write robust, maintainable CSS.

CSS Compatible
Sass is completely compatible with all versions of CSS. We take this compatibility seriously, so that you can seamlessly use any available CSS libraries.

Feature Rich
Sass boasts more features and abilities than any other CSS extension language out there. The Sass Core Team has worked endlessly to not only keep up, but stay ahead.

Mature
Sass has been actively supported for about 15 years by its loving Core Team.

Industry Approved
Over and over again, the industry is choosing Sass as the premier CSS extension language.

Large Community
Sass is actively supported and developed by a consortium of several tech companies and hundreds of developers.

Frameworks
There are an endless number of frameworks built with Sass. Compass, Bourbon, and Susy just to name a few.

Variables
Think of variables as a way to store information that you want to reuse throughout your stylesheet. You can store things like colors, font stacks, or any CSS value you think you'll want to reuse. Sass uses the $ symbol to make something a variable. When the Sass is processed, it takes the variables we define for the $font-stack and $primary-color and outputs normal CSS with our variable values placed in the CSS. This can be extremely powerful when working with brand colors and keeping them consistent throughout the site.

Nesting
When writing HTML you've probably noticed that it has a clear nested and visual hierarchy. CSS, on the other hand, doesn't. Sass will let you nest your CSS selectors in a way that follows the same visual hierarchy of your HTML. Be aware that overly nested rules will result in over-qualified CSS that could prove hard to maintain and is generally considered bad practice.

Partials
You can create partial Sass files that contain little snippets of CSS that you can include in other Sass files. This is a great way to modularize your CSS and help keep things easier to maintain. A partial is a Sass file named with a leading underscore. You might name it something like _partial.scss. The underscore lets Sass know that the file is only a partial file and that it should not be generated into a CSS file. Sass partials are used with the @use rule.

Modules
You don't have to write all your Sass in a single file. You can split it up however you want with the @use rule. This rule loads another Sass file as a module, which means you can refer to its variables, mixins, and functions in your Sass file with a namespace based on the filename. Using a file will also include the CSS it generates in your compiled output!

Mixins
Some things in CSS are a bit tedious to write, especially with CSS3 and the many vendor prefixes that exist. A mixin lets you make groups of CSS declarations that you want to reuse throughout your site. It helps keep your Sass very DRY. You can even pass in values to make your mixin more flexible.

Extend/Inheritance
Using @extend lets you share a set of CSS properties from one selector to another. In our example we're going to create a simple series of messaging for errors, warnings and successes using another feature which goes hand in hand with extend, placeholder classes. A placeholder class is a special type of class that only prints when it is extended, and can help keep your compiled CSS neat and clean.

Operators
Doing math in your CSS is very helpful. Sass has a handful of standard math operators like +, -, *, math.div(), and %.

more news...