diff --git a/lib/DDG/Goodie/SassToCss.pm b/lib/DDG/Goodie/SassToCss.pm
new file mode 100644
index 00000000000..8fe1757847f
--- /dev/null
+++ b/lib/DDG/Goodie/SassToCss.pm
@@ -0,0 +1,42 @@
+package DDG::Goodie::SassToCss;
+# ABSTRACT: Write an abstract here
+
+use DDG::Goodie;
+use YAML::XS 'LoadFile';
+use POSIX;
+use Text::Trim;
+use strict;
+use warnings;
+
+zci answer_type => 'sass_to_css';
+
+zci is_cached => 1;
+
+
+
+# Triggers - http://docs.duckduckhack.com/walkthroughs/calculation.html#triggers
+triggers startend => share('triggers.txt')->slurp;
+
+handle remainder => sub {
+
+ # Return unless the remainder is empty or contains online or tool
+ return unless ( $_ =~ /(^$|online|tool|utility)/i );
+
+ return '',
+ structured_answer => {
+ data => {
+ title => 'Sass to Css Converter',
+ subtitle => 'Enter SASS below, then click the button to convert it to CSS'
+ },
+
+ templates => {
+ group => 'text',
+ item => 0,
+ options => {
+ content => 'DDH.sass_to_css.content'
+ }
+ }
+ };
+};
+
+1;
diff --git a/share/goodie/sass_to_css/content.handlebars b/share/goodie/sass_to_css/content.handlebars
new file mode 100644
index 00000000000..f1f1f5d99bc
--- /dev/null
+++ b/share/goodie/sass_to_css/content.handlebars
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+
diff --git a/share/goodie/sass_to_css/sass_to_css.css b/share/goodie/sass_to_css/sass_to_css.css
new file mode 100644
index 00000000000..56c5bc0ee02
--- /dev/null
+++ b/share/goodie/sass_to_css/sass_to_css.css
@@ -0,0 +1,37 @@
+.sass_to_css--wrap {
+ min-width: 700px;
+ margin-bottom: 10px;
+ margin-left: -1em;
+ width: 80vw;
+}
+
+.zci--sass_to_css textarea {
+ font-family: monospace;
+ resize: vertical;
+ white-space: pre;
+ overflow: auto; /* Hide default scrollbars on IE */
+ margin-left: 1em;
+}
+
+.zci--sass_to_css .sass_to_css--restart_button {
+ cursor: default;
+}
+
+.zci--sass_to_css .sass_to_css--clear_button {
+ cursor: pointer;
+}
+
+.zci--sass_to_css .sass_to_css--error__wrap {
+ margin-top: 1em;
+}
+
+/* Mobile */
+.is-mobile .zci--sass_to_css textarea {
+ resize: vertical;
+}
+
+.is-mobile .zci--sass_to_css button {
+ padding-left: 0;
+ padding-right: 0;
+ width: 100%;
+}
diff --git a/share/goodie/sass_to_css/sass_to_css.js b/share/goodie/sass_to_css/sass_to_css.js
new file mode 100644
index 00000000000..16af681f683
--- /dev/null
+++ b/share/goodie/sass_to_css/sass_to_css.js
@@ -0,0 +1,104 @@
+DDH.sass_to_css = DDH.sass_to_css || {};
+
+DDH.sass_to_css.build = function (ops) {
+ "use strict";
+
+ // Flag to make denote if IA has been shown or not
+ var shown = false,
+ sass;
+ ops.data.rows = is_mobile ? 8 : 30;
+ return {
+ onShow: function () {
+ // Make sure this function is run only once, the first time
+ // the IA is shown otherwise things will get initialized
+ // more than once
+ if (shown)
+ return;
+
+ // Set the flag to true so it doesn't get run again
+ shown = true;
+
+ var $dom = $('.zci--sass_to_css'),
+ $validateButton = $dom.find('.sass_to_css--validate_button'),
+ $clearButton = $dom.find('.sass_to_css--clear_button'),
+ $input = $dom.find('.sass_to_css--input'),
+ $output = $dom.find('.sass_to_css--output'),
+ $error = $dom.find('.sass_to_css--error');
+
+ function enableButtons() {
+ $validateButton
+ .prop('disabled', false)
+ .css('cursor', 'pointer')
+ .removeClass('is-disabled')
+ .addClass('btn--primary');
+ $clearButton
+ .prop('disabled', false)
+ .css('cursor', 'pointer')
+ .removeClass('is-disabled')
+ .addClass('btn--secondary');
+ }
+
+ function disableButtons() {
+ $validateButton
+ .prop('disabled', true)
+ .css('cursor', 'default')
+ .addClass('is-disabled')
+ .removeClass('btn--primary');
+ $clearButton
+ .prop('disabled', true)
+ .css('cursor', 'default')
+ .addClass('is-disabled')
+ .removeClass('btn--secondary');
+ }
+
+ // Load library when the IA is shown for the first time
+ $input.on('input', function () {
+ if (!$input.val().length) {
+ disableButtons();
+ } else if (!sass) {
+
+ $validateButton
+ .text('Loading..');
+
+ DDG.require('sass.js', function () {
+ sass = Sass;
+ $validateButton
+ .text('Convert');
+ enableButtons();
+ });
+ } else {
+ enableButtons();
+ }
+ });
+
+ $validateButton
+ .click(function () {
+ if (sass) {
+ $error.parent().addClass('is-hidden');
+ $output.val('');
+ sass.compile($input.val(), function (result) {
+ if (result.status === 0) {
+ $output.removeClass('is-hidden');
+ $output.val(result.text);
+ return;
+ }
+ $error.parent().removeClass('is-hidden');
+ $error.html(result.formatted);
+ });
+ }
+ });
+
+ $clearButton.click(function () {
+ // clear the input textarea
+ $input.val('');
+ $output.val('');
+ $output.addClass('is-hidden');
+ // hide the results section
+ $error.parent().addClass('is-hidden');
+
+ // disable validate and clear buttons
+ disableButtons();
+ });
+ }
+ };
+};
diff --git a/share/goodie/sass_to_css/triggers.txt b/share/goodie/sass_to_css/triggers.txt
new file mode 100644
index 00000000000..2ffd7356a37
--- /dev/null
+++ b/share/goodie/sass_to_css/triggers.txt
@@ -0,0 +1,7 @@
+sass to css
+convert sass to css
+sass to css converter
+compile sass to css
+converter sass to css
+sass to css compiler
+sass convert to css
diff --git a/t/SassToCss.t b/t/SassToCss.t
new file mode 100644
index 00000000000..5eed0b846a8
--- /dev/null
+++ b/t/SassToCss.t
@@ -0,0 +1,52 @@
+#!/usr/bin/env perl
+
+use strict;
+use warnings;
+use Test::More;
+use Test::Deep;
+use DDG::Test::Goodie;
+
+zci answer_type => 'sass_to_css';
+zci is_cached => 1;
+
+# Build a structured answer that should match the response from the
+# Perl file.
+sub build_structured_answer {
+ my @test_params = @_;
+
+ return "",
+ structured_answer => {
+ data => {
+ title => 'Sass to Css Converter',
+ subtitle => 'Enter SASS below, then click the button to convert it to CSS',
+ },
+
+ templates => {
+ group => "text",
+ item => 0,
+ options => {
+ content => "DDH.sass_to_css.content"
+ }
+ }
+ };
+}
+
+# Use this to build expected results for your tests.
+sub build_test { test_zci(build_structured_answer(@_)) }
+
+ddg_goodie_test(
+ [qw( DDG::Goodie::SassToCss )],
+
+ 'sass to css' => build_test(),
+ 'sass to css converter' => build_test(),
+ 'compile sass to css' => build_test(),
+ 'converter sass to css' => build_test(),
+ 'sass to css compiler' => build_test(),
+ 'sass convert to css' => build_test(),
+ 'compile sass to css' => build_test(),
+
+ 'convert sass' => undef,
+
+);
+
+done_testing;