Version 0.7.0 has been released! See the release announcement for more information.

Also, if you like BluestNight, please consider supporting its development.

Add the following to your site’s config.toml file:

    src = "images/background_lg.png"
    #medium_src = "images/background_med.png"
    #small_src = "images/background_sm.png"
    fit = "auto"
    tile = false
        src: images/background_lg.png
        #medium_src: images/background_med.png
        #small_src: images/background_sm.png
        fit: auto
        tile: false
    "params": {
        "background": {
            "src": "images/background_lg.png",
            "medium_src": "images/background_med.png",
            "small_src": "images/background_sm.png",
            "fit": "auto",
            "tile": false
  • Change src to the relative path from the site’s baseURL where the background image can be found. In the above example, the file would be found at {site root}/static/images/background.png.
    • If the file is hosted on another website, use that image’s URL instead.
  • Optionally set medium_src and small_src to smaller images to use on screens that are at most 1024px and 640px, respectively. If either of these are omitted, the next largest image source will be used.
  • Set fit to "contain" if you want the behavior of CSS background-size: contain, and "cover" if you want the behavior of background-size: cover, and anything else to not stretch the image at all. Setting it to “auto” uses the default behavior of background-size: auto;.