<commit_before>---
title: Sass Styles
subTitle: Development
nav: docs
description: Owl Carousel Documentation

sort: 3
tags:
- Development
---

{{#markdown }}
## Using Sass
> Owl uses the Sass pre-processor to build CSS for all main modules and themes. If you don’t know Sass, have a look at their [website](http://sass-lang.com/) and you’ll love it. Owl uses a faster adaptation of Sass written in C, [libsass](http://libsass.org/) (via [grunt-sass](https://github.com/sindresorhus/grunt-sass)), that doesn't require a Ruby dependency for our build process.

To build the CSS from its Sass source, it’s required to have:

* [Node.js](http://nodejs.org/)
* [Grunt](http://gruntjs.com/)

Check this [tutorial](http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/) to learn how to use Sass and libsass in Grunt environment.

### SCSS Files included

Source files can be found on [Github Project]( {{ pkg.homepage }})

```
src/
└── scss/
    ├── _mixins.scss
    ├── _theme.scss
    ├── owl.carousel.scss
    ├── owl.animate.scss
    ├── owl.autoheight.scss
    ├── owl.lazyload.scss
    ├── owl.video.scss
    ├── owl.theme.default.scss
    └── owl.theme.green.scss
```

### _mixins.scss

_mixins contain basic snippets generators for CSS3 cross-browser styles.

### _theme.scss

Scss structure for theme. Use owl.carousel.defautl.scss to change variables and generate new styles.

### owl.carousel.scss

Core file to handle basic styles and override some unnecessary browsers behaviors. You shouldn’t change this file unless you have to.

### owl.[pluginname].scss

Styles for modules.

### owl.theme.*.scss

Theme files for dots and navigations buttons. Use `owl.theme.default.scss` to upgrade to your own styles or create a new theme.


{{/markdown }}

<commit_msg>fix type<commit_after>---
title: Sass Styles
subTitle: Development
nav: docs
description: Owl Carousel Documentation

sort: 3
tags:
- Development
---

{{#markdown }}
## Using Sass
> Owl uses the Sass pre-processor to build CSS for all main modules and themes. If you don’t know Sass, have a look at their [website](http://sass-lang.com/) and you’ll love it. Owl uses a faster adaptation of Sass written in C, [libsass](http://libsass.org/) (via [grunt-sass](https://github.com/sindresorhus/grunt-sass)), that doesn't require a Ruby dependency for our build process.

To build the CSS from its Sass source, it’s required to have:

* [Node.js](http://nodejs.org/)
* [Grunt](http://gruntjs.com/)

Check this [tutorial](http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/) to learn how to use Sass and libsass in Grunt environment.

### SCSS Files included

Source files can be found on [Github Project]( {{ pkg.homepage }})

```
src/
└── scss/
    ├── _mixins.scss
    ├── _theme.scss
    ├── owl.carousel.scss
    ├── owl.animate.scss
    ├── owl.autoheight.scss
    ├── owl.lazyload.scss
    ├── owl.video.scss
    ├── owl.theme.default.scss
    └── owl.theme.green.scss
```

### _mixins.scss

_mixins contain basic snippets generators for CSS3 cross-browser styles.

### _theme.scss

Scss structure for theme. Use owl.carousel.default.scss to change variables and generate new styles.

### owl.carousel.scss

Core file to handle basic styles and override some unnecessary browsers behaviors. You shouldn’t change this file unless you have to.

### owl.[pluginname].scss

Styles for modules.

### owl.theme.*.scss

Theme files for dots and navigations buttons. Use `owl.theme.default.scss` to upgrade to your own styles or create a new theme.


{{/markdown }}


{'fraction_non_alphanumeric': 0.12781328146707419, 'fraction_numerical': 0.0011114198388441233, 'mean_word_length': 3.761904761904762, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2002005', 'n_tokens_mistral': 1242, 'n_tokens_neox': 1224, 'n_words': 409}