diff --git a/ignite-html-select.js b/ignite-html-select.js
index 9852f6e..aedb41c 100644
--- a/ignite-html-select.js
+++ b/ignite-html-select.js
@@ -150,10 +150,12 @@ import { IgniteTemplate } from "../ignite-html/ignite-template.js";
 }
 
 /**
- * Generates a series of options based on key value pairs.
+ * Generates a series of options from an array of values, or an object of key values pairs.
  * @param {Array|Object} options An array of strings or list of key value pairs to create options from.
  * @param {*} placeholder The placeholder option, it's value will be 0, if set this text will be shown.
  * @returns {IgniteTemplate} This ignite template.
+ * @example IgniteTemplate.prototype.options([{"Custom value": "Display value"}, "value2", "value3"]);
+ * @example IgniteTemplate.prototype.options({"value1": "A", "value2": "B"});
  */
  IgniteTemplate.prototype.options = function(options, placeholder = null) {
     //Generate html and populate the template with it.
@@ -165,7 +167,12 @@ import { IgniteTemplate } from "../ignite-html/ignite-template.js";
 
     if (Array.isArray(options)) {
         for (var i = 0; i < options.length; i++) {
-            html += `<option value='${options[i]}'>${options[i]}</option>`;
+            if (options[i] instanceof Object) {
+                var keys = Object.keys(options[i]);
+                html += `<option value='${keys[0]}'>${options[i][keys[0]]}</option>`;
+            } else {
+                html += `<option value='${options[i]}'>${options[i]}</option>`;
+            }
         }
     } else {
         var keys = Object.keys(options);