Skip to content
Eugene Lazutkin edited this page Mar 18, 2014 · 6 revisions

Type: String

Default value: ''

A string value that specifies a color to be used as a background. By default it is empty, which means to use a transparent background.

Valid CSS color constants can be used as this property's value: 'black', '#123456', '#123', 'RGB(123, 45, 67)', and so on. Please consult CSS Color Module Level 4 for more details.

Examples

Example #1

Use the default (a transparent background):

grunt.initConfig({
  tight_sprite: {
    icons: {
      options: {
        hide: "images/icons/"
      },
      src: ["images/icons/**/*.png"],
      dest: "images/icons.png"
    }
  }
})

Example #2

Use white as a background:

grunt.initConfig({
  tight_sprite: {
    icons: {
      options: {
        background: "white",
        hide: "images/icons/"
      },
      src: ["images/icons/**/*.png"],
      dest: "images/icons.png"
    }
  }
})

Example #3

Use red as a background:

grunt.initConfig({
  tight_sprite: {
    icons: {
      options: {
        background: "#f00",
        hide: "images/icons/"
      },
      src: ["images/icons/**/*.png"],
      dest: "images/icons.png"
    }
  }
})

Example #4

Use green as a background:

grunt.initConfig({
  tight_sprite: {
    icons: {
      options: {
        background: "#00FF00",
        hide: "images/icons/"
      },
      src: ["images/icons/**/*.png"],
      dest: "images/icons.png"
    }
  }
})

Example #5

Use blue as a background:

grunt.initConfig({
  tight_sprite: {
    icons: {
      options: {
        background: "RGB(0, 0, 255)",
        hide: "images/icons/"
      },
      src: ["images/icons/**/*.png"],
      dest: "images/icons.png"
    }
  }
})