Random style options for Anki Cards for improved memory

random_style_options.js

/*******************************************************************
 * Copy the following code into the FRONT SIDE of any card template in Anki.
 * 
 * Find the next comment block for the snippet for the BACK SIDE.
 ******************************************************************/

<script>
    var modifyIt = document.getElementsByTagName("body")[0];
    
    if (document.getElementsByTagName("hr").length == 0)
    {
        var randomStyleOptions = {
            "color" : [
                "black",
                "#666666",
                "#616161",
                "#5C5C5C",
                "#545454",
                "#4A4A4A",
                "#424242",
                "#363636",
                "#2B2B2B",
                "#212121",
                "#1A1A1A",
                "#141414",
                "#0D0D0D",
                "#080808",
                "#050505"
            ],
            "font-size" : [
                "125%",
                "150%",
                "175%",
                "200%",
                "225%",
                "250%",
                "275%",
                "300%"
            ],
            "font-family" : [
                // Brandon: to escape quotes (") within a string, you use the backslash. Font names that have spaces need to be contained
                // within quotes. That's what is up with all the backslashes and quotes below.
                "Georgia, serif",
                "\"Times New Roman\", Times, serif",
                "Arial, Helvetica, sans-serif",
                "\"Lucida Sans Unicode\", \"Lucida Grande\", sans-serif",
                "Tahoma, Geneva, sans-serif",
                "\"Trebuchet MS\", Helvetica, sans-serif",
                "Verdana, Geneva, sans-serif"
            ]
        }
    
        for (var key in randomStyleOptions)
        {
            var items = randomStyleOptions[key];
            var item = items[Math.floor(Math.random()*items.length)]; // pick any random item
            modifyIt.style[key] = item;
        }
    }
</script>


/*******************************************************************
 * Copy this code into the BACK SIDE of any card template in Anki.
 * 
 * You also must enclose the contents of the BACK SIDE in a div with the class "random style".
 * An example is presented after the following code.
 ******************************************************************/
<script>
    var modifyIt = document.getElementsByClassName("random_style")[0];
    modifyIt.setAttribute("style", document.body.getAttribute("style"));
    document.body.setAttribute("style", "");
</script>

/*********************************************************
 * The back side of my basic card looks like the following
 *********************************************************/
 
<div class="random_style">  <!-- ADD THIS -->
{{Front}}

<hr id=answer>

{{Back}}
</div> <!-- AND THIS -->

<!-- THEN THIS SCRIPT -->
<script>
    var modifyIt = document.getElementsByClassName("random_style")[0];
    modifyIt.setAttribute("style", document.body.getAttribute("style"));
    document.body.setAttribute("style", "");
</script>