Giter Club home page Giter Club logo

moonlight's Introduction



Moonlight

A color theme inspired by the camping vibe 🏕

       

One day I saw Moonlight GMK keycaps, and I somehow fall in love with the colors, so I decided to make a color theme and call it Moonlight and this is the Moonlight color theme birth story.
after a while, I made some wallpapers and then designed some themes for several ports all have moonlight colors in common, then I came up with this color theme...

The theme colors

# Color name HEX RGB HSL Family
01 light-I #c0cedd rgb(192, 206, 221) hsl(211, 30%, 81%) White moon
02 light-II #99a0a8 rgb(153, 160, 168) hsl(212, 8%, 63%) White moon
03 light-III #c6c3c0 rgb(198, 195, 192) hsl(30, 5%, 76%) White moon
04 dark-I #191f28 rgb(25, 31, 40) hsl(216, 23%, 13%) Night sky
05 dark-II #1f2730 rgb(31, 39, 48) hsl(212, 22%, 15%) Night sky
06 dark-III #374656 rgb(55, 70, 86) hsl(211, 22%, 28%) Night sky
07 accent-I #ecbd7c rgb(236, 189, 124) hsl(35, 75%, 71%) light
08 accent-II #c69f68 rgb(198, 159, 104) hsl(35, 45%, 59%) light
09 accent-III #93764d rgb(147, 118, 77) hsl(35, 31%, 44%) light
10 color-I #c68768 rgb(198, 135, 104) hsl(20, 45%, 59%) Frills
11 color-II #c66868 rgb(198, 104, 104) hsl(0, 45%, 59%) Frills
12 color-III #c66890 rgb(198, 104, 144) hsl(334, 45%, 59%) Frills
13 color-IV #6880c6 rgb(104, 128, 198) hsl(225, 45%, 59%) Frills
14 color-V #68aec6 rgb(104, 174, 198) hsl(195, 45%, 59%) Frills
15 color-VI #9fc76d rgb(159, 199, 109) hsl(87, 45%, 60%) Frills

The theme color families

White moon

colors from 01 to 03
White moon is the Light color palette that can mostly be used as the text color.
So color light-I is the brightest one that can be used primarily as font color or as a background for white color themes.
While color light-II is a bit more bluish to add some variation to the light colors.
On the other side color light-III is a bit more orange "hotter" color which serve the same purpose as color light-II.

Night sky

colors from 04 to 06
Night Sky is the primary dark color palette for the Moonlight color theme.
Night Sky palette consists of three colors ranging from dark-I a dark bluish color that is very useful for an eye comfortable dark theme background.
While dark-II is a bit much brighter than dark-I.
Lastly we have dark-III which is a high saturated and bright color with a distinguished contrast from color dark-I.

Light

colors from 07 to 09
light is the accent color palette for the moonlight color theme.
light is a yellow color variation that starts from color accent-I which is the brightest color form this color palette.
Then it is followed by the real accent color accent-II which looks incredible with the night sky family as a background.
And finishing with color accent-III which is the darkest variation of this family.

​Frills

colors from 10 to 15
​Frills colors are different hues colors ranging almost like the rainbow colors... the main use is for parts that require adding colorful variations, but with the "Moonlighty" feeling.
Frills are the last family in the moonlight color theme which holds six colors with high hue variations and is mostly used to give some life to the themed result.
Starting with color color-I which is more of a orangic youllowish color, followd by color-II which is more orangic than color-I, going to color-III which is a nice less saturated light pink, followed by color-IV a bluish purpleic color that males a very nice contarst with the backgriund color variations, then going for color-V a less purplic turquoise color, which male a buetiful companation with color-VI a light grassy green color.

moonlight's People

Contributors

abod1960 avatar

Stargazers

 avatar  avatar  avatar

moonlight's Issues

Contributing New Website Themes

Recently I have been working to add Moonlight theme support to a handful of websites using the Stylus extension. If I wanted to contribute those themes to this repository, how would I do so?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.