├── package.json
├── README.md
├── index.js
└── compositor.json


/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "hypercolors",
 3 |   "version": "1.0.0-beta.1",
 4 |   "description": "Generative hyperterm color theme",
 5 |   "main": "index.js",
 6 |   "keywords": [
 7 |     "hyperterm",
 8 |     "hyperterm-theme"
 9 |   ],
10 |   "author": "Brent Jackson",
11 |   "license": "MIT",
12 |   "dependencies": {
13 |     "chroma-js": "^1.2.1",
14 |     "hello-color": "^1.0.1"
15 |   }
16 | }
17 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | 
 2 | # hypercolors
 3 | 
 4 | Generative hyperterm color theme
 5 | 
 6 | ![Screenshot](https://cloud.githubusercontent.com/assets/3451712/17651737/2b396cae-623b-11e6-9428-9f901a867e1a.png)
 7 | 
 8 | In `~/.hyperterm.js` add `hypercolors` to the plugins array.
 9 | 
10 | ```js
11 |   plugins: [
12 |     'hypercolors'
13 |   ]
14 | ```
15 | 
16 | Every time hyperterm is opened, a randomly generated color scheme is created for that session. Force reloading will also update the colors.
17 | 
18 | Built with:
19 | 
20 | - [chroma-js](https://github.com/gka/chroma.js/)
21 | - [hello-color](https://github.com/jxnblk/hello-color)
22 | 
23 | MIT License
24 | 


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
 1 | 
 2 | const chroma = require('chroma-js')
 3 | const hello = require('hello-color').default
 4 | 
 5 | const getBase = () => {
 6 |   let base = chroma.random()
 7 |   while (chroma(base).hsl()[1] > 1 / 3) {
 8 |     base = chroma(base).desaturate(1 / 8).hex()
 9 |   }
10 |   return base
11 | }
12 | 
13 | exports.decorateConfig = config => {
14 |   const base = getBase()
15 |   const {
16 |     color,
17 |     scale,
18 |     hues
19 |   } = hello(base, {
20 |     hues: 5,
21 |     contrast: 5,
22 |   })
23 | 
24 |   const foregroundColor = color
25 |   const backgroundColor = base
26 |   const borderColor = scale[1]
27 | 
28 |   const colors = [
29 |     backgroundColor,
30 |     scale[7],
31 |     scale[7],
32 |     scale[7],
33 |     scale[6],
34 |     scale[5],
35 |     scale[5],
36 |     scale[5],
37 |     scale[6],
38 |     scale[7],
39 |     scale[7],
40 |     scale[6],
41 |     scale[5],
42 |     scale[5],
43 |     scale[5],
44 |     foregroundColor,
45 |     foregroundColor
46 |   ]
47 | 
48 |   return Object.assign({}, config, {
49 |     foregroundColor,
50 |     backgroundColor,
51 |     borderColor,
52 |     colors,
53 |     termCSS: `${config.termCSS || ''} .cursor-node{mix-blend-mode:difference;}`
54 |   })
55 | }
56 | 
57 | 


--------------------------------------------------------------------------------
/compositor.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "jxnblk/hypercolors",
 3 |   "version": "0.1.4",
 4 |   "libraries": {
 5 |     "xv": "^1.1.19"
 6 |   },
 7 |   "title": "Hypercolors",
 8 |   "branch": "",
 9 |   "style": {
10 |     "name": "Material",
11 |     "componentSet": {
12 |       "nav": "nav/DarkAbsoluteNav",
13 |       "header": "header/GradientHeader",
14 |       "article": "article/BasicArticle",
15 |       "footer": "footer/BasicFooter"
16 |     },
17 |     "fontFamily": "Roboto, sans-serif",
18 |     "heading": {
19 |       "fontWeight": 500,
20 |       "letterSpacing": "-0.01em"
21 |     },
22 |     "colors": {
23 |       "text": "#212121",
24 |       "background": "#fff",
25 |       "primary": "#2196f3",
26 |       "secondary": "#1565c0",
27 |       "highlight": "#ff4081",
28 |       "border": "#e0e0e0",
29 |       "muted": "#f5f5f5"
30 |     },
31 |     "layout": {
32 |       "centered": true,
33 |       "bannerHeight": "80vh",
34 |       "maxWidth": 896
35 |     }
36 |   },
37 |   "content": [
38 |     {
39 |       "component": "nav",
40 |       "links": [
41 |         {
42 |           "href": "https://github.com/jxnblk/hypercolors",
43 |           "text": "GitHub"
44 |         },
45 |         {
46 |           "href": "https://npmjs.com/package/hypercolors",
47 |           "text": "npm"
48 |         }
49 |       ]
50 |     },
51 |     {
52 |       "component": "header",
53 |       "heading": "hypercolors",
54 |       "subhead": "Generative hyperterm color theme",
55 |       "children": [
56 |         {
57 |           "component": "ui/TweetButton",
58 |           "text": "hypercolors: Generative hyperterm color theme",
59 |           "url": ""
60 |         },
61 |         {
62 |           "component": "ui/GithubButton",
63 |           "user": "jxnblk",
64 |           "repo": "hypercolors"
65 |         }
66 |       ],
67 |       "text": "v1.0.0-beta.1"
68 |     },
69 |     {
70 |       "component": "article",
71 |       "metadata": {
72 |         "source": "github.readme"
73 |       },
74 |       "html": "\n\n<p></p>\n<p>In <code>~/.hyperterm.js</code> add <code>hypercolors</code> to the plugins array.</p>\n<pre>  plugins: [\n    <span class=\"hljs-string\">&apos;hypercolors&apos;</span>\n  ]</pre><p>Every time hyperterm is opened, a randomly generated color scheme is created for that session. Force reloading will also update the colors.</p>\n<p>Built with:</p>\n<ul>\n<li><a href=\"https://github.com/gka/chroma.js/\">chroma-js</a></li>\n<li><a href=\"https://github.com/jxnblk/hello-color\">hello-color</a></li>\n</ul>\n<p>MIT License</p>\n"
75 |     },
76 |     {
77 |       "component": "footer",
78 |       "links": [
79 |         {
80 |           "href": "https://github.com/jxnblk/hypercolors",
81 |           "text": "GitHub"
82 |         },
83 |         {
84 |           "href": "https://github.com/jxnblk",
85 |           "text": "jxnblk"
86 |         }
87 |       ]
88 |     }
89 |   ]
90 | }


--------------------------------------------------------------------------------