Chorke Color Scheme: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
|||
| (49 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
{| | |||
| valign="top" | | |||
'''Chorke Colors:''' | |||
─┬───────────────────────── | |||
├─ RED : #F42A41 | |||
├─ GREEN: #006A4E | |||
└─ WHITE: #FFFFFF | |||
| valign="top" | | |||
'''Chorke Logo Colors:''' | |||
─┬───────────────────────── | |||
├─ √ GREEN + WHITE | |||
├─ 1 RED + WHITE | |||
└─ 2 WHITE + GREEN | |||
| valign="top" | | |||
'''Chorke Concerns Logo Colors:''' | |||
─┬───────────────────────── | |||
├─ √ GREEN + RED + WHITE | |||
├─ 1 WHITE + RED + WHITE | |||
└─ 2 WHITE + GREEN + WHITE | |||
| valign="top" | | |||
'''Chorke Green Colors:''' | |||
─┬───────────────────────── | |||
├─ GREEN_DARK_1X: #008937 | |||
├─ GREEN_DARK_2X: #005623 | |||
└─ GREEN_DARK_3X: #00230E | |||
|} | |||
---- | |||
{| | |||
| valign="top" | | |||
'''Green Black Colors:''' | |||
─┬───────────────────────── | |||
├─ GREEN_BLACK_3X: #1B5E20 | |||
├─ GREEN_BLACK_2X: #2E7D32 | |||
└─ GREEN_BLACK_1X: #388E3C | |||
| valign="top" | | |||
'''Green Plain Colors:''' | |||
─┬───────────────────────── | |||
├─ GREEN_PLAIN_1X: #43A047 | |||
├─ GREEN_PLAIN_2X: #4CAf50 | |||
└─ GREEN_PLAIN_3X: #66BB6A | |||
| valign="top" | | |||
'''Green White Colors:''' | |||
─┬───────────────────────── | |||
├─ GREEN_WHITE_1X: #81C784 | |||
├─ GREEN_WHITE_2X: #A5D6A7 | |||
└─ GREEN_WHITE_3X: #C8E6C9 | |||
|} | |||
==Green Variation== | |||
{| | |||
| valign="top" | | |||
'''Green Pear Black:''' | |||
─┬───────────────────────── | |||
├─ GREEN_PEAR_3XB: #1B5E20 | |||
├─ GREEN_PEAR_2XB: #2E7D32 | |||
└─ GREEN_PEAR_1XB: #388E3C | |||
'''Green Pear Plain:''' | |||
─┬───────────────────────── | |||
├─ GREEN_PEAR_1XP: #43A047 | |||
├─ GREEN_PEAR_2XP: #4CAF50 | |||
└─ GREEN_PEAR_3XP: #66BB6A | |||
'''Green Pear White:''' | |||
─┬───────────────────────── | |||
├─ GREEN_PEAR_1XW: #81C784 | |||
├─ GREEN_PEAR_2XW: #A5D6A7 | |||
├─ GREEN_PEAR_3XW: #C8E6C9 | |||
└─ GREEN_PEAR_4XW: #E8F5E9 | |||
| valign="top" | | |||
'''Green Lime Black:''' | |||
─┬───────────────────────── | |||
├─ GREEN_LIME_3XB: #33691E | |||
├─ GREEN_LIME_2XB: #558B2F | |||
└─ GREEN_LIME_1XB: #689F38 | |||
'''Green Lime Plain:''' | |||
─┬───────────────────────── | |||
├─ GREEN_LIME_1XP: #7CB342 | |||
├─ GREEN_LIME_2XP: #8BC34A | |||
└─ GREEN_LIME_3XP: #9CCC65 | |||
'''Green Lime White:''' | |||
─┬───────────────────────── | |||
├─ GREEN_LIME_1XW: #AED581 | |||
├─ GREEN_LIME_2XW: #C5E1A5 | |||
├─ GREEN_LIME_3XW: #DCEDC8 | |||
└─ GREEN_LIME_4XW: #F1F8E9 | |||
| valign="top" | | |||
'''Green Gold Black:''' | |||
─┬───────────────────────── | |||
├─ GREEN_GOLD_3XB: #827717 | |||
├─ GREEN_GOLD_2XB: #9E9D24 | |||
└─ GREEN_GOLD_1XB: #AFB42B | |||
'''Green Gold Plain:''' | |||
─┬───────────────────────── | |||
├─ GREEN_GOLD_1XP: #C0CA33 | |||
├─ GREEN_GOLD_2XP: #CDDC39 | |||
└─ GREEN_GOLD_3XP: #D4E157 | |||
'''Green Gold White:''' | |||
─┬───────────────────────── | |||
├─ GREEN_GOLD_1XW: #DCE775 | |||
├─ GREEN_GOLD_2XW: #E6EE9C | |||
├─ GREEN_GOLD_3XW: #F0F4C3 | |||
└─ GREEN_GOLD_4XW: #F9FBE7 | |||
|} | |||
== Reference site == | |||
Chorke Color Scheme is one of the important most factor. We love green and it's variation | Chorke Color Scheme is one of the important most factor. We love green and it's variation | ||
{| | |||
| valign="top" | | |||
# [https://ibblportal.islamibankbd.com/indexLogin.do IBBL Banner] | |||
# [https://www.overleaf.com/gallery/tagged/book/page/3 LaTex Theme] | |||
# [https://community.jaspersoft.com Download Now] | |||
# [http://www.colorzilla.com/gradient-editor Gradient Editor ] | |||
# [http://doc.chorke.org/theme/material/#!/app/matcolors Angle Matcolors] | |||
# [https://www.nist.gov '''Featured Topics'''] | |||
# [https://www.phpmyadmin.net Gradient Button] | # [https://www.phpmyadmin.net Gradient Button] | ||
# [https://sourceforge.net/projects/jasperstudio Download Button] | # [https://sourceforge.net/projects/jasperstudio Download Button] | ||
# [https:// | # [https://www.cssmatic.com/gradient-generator Gradient Generator] | ||
# [https://en.wikipedia.org/wiki/Flag_of_Bangladesh Flag of Bangladesh] | |||
| valign="top" | | |||
# [https://www.jfrog.com/confluence jfrog.com/confluence] | |||
# [https://mycolor.space/gradient mycolor.space/gradient] | |||
# [http://www.baeldung.com/hikaricp Download Button & Banner] | # [http://www.baeldung.com/hikaricp Download Button & Banner] | ||
# [https://www. | # [https://forums.docker.com/t/ forums.docker.com/banner] | ||
# [http:// | # [https://tomcat.apache.org/ tomcat.apache.org/banner] | ||
# [https://www.channelionline.com/ channelionline.com/banner] | |||
|} | |||
== Collection of Green Gradient == | |||
=== From [http://bitbybitblog.com/environment-variables-mac/ www.bitbybitblog.com] === | |||
<syntaxhighlight lang="css"> | |||
.cki-banner-bg { | |||
top: 5px; | |||
width: 100%; | |||
height: 100px; | |||
background: #1B6B5B; | |||
/* background-color: #000000; */ | |||
/* background-color: #0CBE88; */ | |||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33A26A', endColorstr='#1B6B5B'); | |||
background: -webkit-gradient(linear, left top, left bottom, from(#33A26A), to(#1B6B5B)); | |||
background: -moz-linear-gradient(top, #33A26A, #1B6B5B); | |||
} | |||
</syntaxhighlight> | |||
=== From [https://www.phpmyadmin.net/ www.phpmyadmin.net] === | |||
<syntaxhighlight lang="css"> | |||
.cki-btn-success { | |||
background-image: -webkit-linear-gradient(top,#5cb85c 0,#419641 100%); | |||
background-image: -o-linear-gradient(top,#5cb85c 0,#419641 100%); | |||
background-image: -webkit-gradient(linear,left top,left bottom,from(#5cb85c),to(#419641)); | |||
background-image: linear-gradient(to bottom,#5cb85c 0,#419641 100%); | |||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c',endColorstr='#ff419641',GradientType=0); | |||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
background-repeat: repeat-x; | |||
border-color: #3e8f3e; | |||
} | |||
.cki-btn-success { | |||
color: #fff; | |||
background-color: #5cb85c; | |||
border-color: #4cae4c; | |||
} | |||
.cki-btn-default, | |||
.cki-btn-success { | |||
text-shadow: 0 -1px 0 rgba(0,0,0,0.2); | |||
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 1px 1px rgba(0,0,0,0.075); | |||
box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 1px 1px rgba(0,0,0,0.075); | |||
} | |||
</syntaxhighlight> | |||
=== From [https://www.channelionline.com/ www.channelionline.com] === | |||
<syntaxhighlight lang="css"> | |||
#cki-header-custom .cki-header-time { | |||
background-color: #2A9060; | |||
padding: 10px 0; | |||
color: #fff; | |||
} | |||
#cki-header-custom .cki-header-ads { | |||
background-color: #339966; | |||
min-height: 60px; | |||
padding: 10px 0; | |||
} | |||
</syntaxhighlight> | |||
=== From [https://ibblportal.islamibankbd.com/indexLogin.do ibblportal.islamibankbd.com] === | |||
<syntaxhighlight lang="css"> | |||
.cki-banner-bg { | |||
background: -moz-linear-gradient(center top, rgb(0, 84, 41), rgb(47, 139, 1)) repeat scroll 0% 0% transparent; | |||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#005429), to(#2F8B01)); | |||
box-shadow: 0px 0px 1px rgb(190, 209, 185) inset; | |||
-webkit-box-shadow: inset 0 1px 0 #CBD6CE, inset 0 -1px 0 #CBD6CE, 0 0 15px rgba(0, 0, 0, 0.07); | |||
-moz-box-shadow: inset 0 1px 0 #CBD6CE, inset 0 -1px 0 #CBD6CE, 0 0 15px rgba(0, 0, 0, 0.07); | |||
background-color: #007C3C; | |||
overflow: hidden; | |||
padding: 3px; | |||
height: 70px; | |||
clear: both; | |||
margin: 0; | |||
} | |||
</syntaxhighlight> | |||
=== From [https://sourceforge.net/projects/jasperstudio sourceforge.net/projects/jasperstudio] === | |||
<syntaxhighlight lang="css"> | |||
.cki-span-bg { | |||
background-image: linear-gradient(to bottom, #393 0%, #373 100%); | |||
border-radius: 3px; | |||
background: #363; | |||
margin-left: 35px; | |||
overflow: hidden; | |||
text-align: left; | |||
display: block; | |||
padding: 4px; | |||
height: 34px; | |||
margin: 3px; | |||
color: #FFF; | |||
} | |||
</syntaxhighlight> | |||
=== From [https://community.jaspersoft.com/download community.jaspersoft.com] === | |||
<syntaxhighlight lang="css"> | |||
.cki-btn.cki-green { | |||
background: #50ab22; | |||
border-top: 1px solid #7CD450; | |||
background: -moz-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%); | |||
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#50ab22),color-stop(45%,#3f8c13),color-stop(78%,#327311),color-stop(100%,#245c08)); | |||
background: -webkit-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%); | |||
background: -o-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%); | |||
background: -ms-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%); | |||
background: linear-gradient(to bottom,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%); | |||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#50ab22',endColorstr='#245c08',GradientType=0); | |||
-webkit-transition: background 150ms; | |||
-webkit-background-size: 100% 120%; | |||
-moz-transition: background 150ms; | |||
-moz-background-size: 100% 120%; | |||
transition: background 150ms; | |||
background-position: 0 -5px; | |||
background-size: 100% 120%; | |||
} | |||
</syntaxhighlight> | |||
=== From [https://www.cssmatic.com/gradient-generator cssmatic.com/gradient-generator] === | |||
<syntaxhighlight lang="scss"> | |||
.cki-banner-bg { | |||
background-color: rgba(12,135,16,1); | |||
background: @include filter-gradient(#0c8710, #84ba54, horizontal); | |||
background: @include background-image(linear-gradient(left, rgba(12,135,16,1) 0%, rgba(132,186,84,1) 100%)); | |||
} | |||
</syntaxhighlight> | |||
=== From [http://www.colorzilla.com/gradient-editor colorzilla.com/gradient-editor/] === | |||
<syntaxhighlight lang="scss"> | |||
.cki-banner-bg { | |||
// http://colorzilla.com/gradient-editor/#a9e4f7+0,d8f7ad+0,278909+100 | |||
background-color: rgb(169,228,247); // Old browsers | |||
@include filter-gradient(#a9e4f7, #278909, horizontal); // IE6-9 | |||
@include background-image(linear-gradient(left, rgba(169,228,247,1) 0%,rgba(216,247,173,1) 0%,rgba(39,137,9,1) 100%)); | |||
} | |||
</syntaxhighlight> | |||
=== From [https://forums.docker.com/t/ forums.docker.com/t/] === | |||
<syntaxhighlight lang="scss"> | |||
.cki-banner-bg { | |||
background-color: #1b5e20; | |||
background-image: radial-gradient(circle, #4caf50 0%, #1b5e20 100%); | |||
position: absolute; | |||
height: 100%; | |||
width: 100%; | |||
z-index: -1; | |||
} | |||
/*.cki-banner-bg { | |||
background: #4caf50; | |||
background: -moz-linear-gradient(top, #4caf50 0%, #1b5e20 100%); | |||
background: -webkit-gradient(left top, left bottom, color-stop(0%, #4caf50), color-stop(100%, #1b5e20)); | |||
background: -webkit-linear-gradient(top, #4caf50 0%, #1b5e20 100%); | |||
background: -o-linear-gradient(top, #4caf50 0%, #1b5e20 100%); | |||
background: -ms-linear-gradient(top, #4caf50 0%, #1b5e20 100%); | |||
background: linear-gradient(to bottom, #4caf50 0%, #1b5e20 100%); | |||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4caf50', endColorstr='#1b5e20', GradientType=0 ); | |||
}*/ | |||
</syntaxhighlight> | |||
=== From [https://tomcat.apache.org/ tomcat.apache.org] === | |||
<syntaxhighlight lang="scss"> | |||
.cki-banner-bg { | |||
padding-left: 15px; | |||
padding-right: 15px; | |||
background-color: #4caf50; | |||
background: linear-gradient(to bottom, #1b5e20 -10%, #4caf50 100%); | |||
position: relative; | |||
} | |||
</syntaxhighlight> | |||
=== From [https://www.nist.gov/ nist.gov] === | |||
<syntaxhighlight lang="scss"> | |||
.cki-featured-topics .field-featured-topic-area { | |||
text-align: center; | |||
font-size: 22px; | |||
line-height: 26px; | |||
color: #257a2d; | |||
text-transform: uppercase; | |||
margin-top: 0; | |||
font-weight: 400; | |||
} | |||
</syntaxhighlight> | |||
== Collection of Green Banner == | |||
=== Chorke banner like TP-Link === | |||
For [http://chorke.org Chorke, Inc.] banner we banner graphics some things like that. Background graphics is ok. But there need correction of floating transparent gradient on top of background images. | |||
[[File:Chorke banner like TP-Link.jpg|600px|frame|center]] | |||
=== [http://smarthealthstandard.kr/publish/main.php Smart Health Standards Forum] === | |||
<gallery> | |||
Chorke benzene color background.png|Benzene Color | |||
Chorke benzene plain background.png|Benzene Plain | |||
</gallery> | |||
==References== | |||
* [https://www.shareicon.net/social-network-google-drive-92727 Rounded Hexagon Google Drive] | |||
* [https://www.vexels.com/png-svg/preview/139199/rounded-hexagon-shape Rounded Hexagon Shape] | |||
* [https://www.shareicon.net/xing-social-network-92713 Rounded Hexagon Xing] | |||
* [https://examples.sencha.com/extjs/6.7.0/examples/kitchensink/frame-index.html?classic#tree-list Navigation or Tree List] | |||
* [http://cdn.shahed.biz/docs/theme/material/#!/app/matcolors Matte Color Plate] | |||
* [https://htmlcolorcodes.com/color-names/ Color Names] | |||
Latest revision as of 23:57, 2 August 2020
Chorke Colors: ─┬───────────────────────── ├─ RED : #F42A41 ├─ GREEN: #006A4E └─ WHITE: #FFFFFF |
Chorke Logo Colors: ─┬───────────────────────── ├─ √ GREEN + WHITE ├─ 1 RED + WHITE └─ 2 WHITE + GREEN |
Chorke Concerns Logo Colors: ─┬───────────────────────── ├─ √ GREEN + RED + WHITE ├─ 1 WHITE + RED + WHITE └─ 2 WHITE + GREEN + WHITE |
Chorke Green Colors: ─┬───────────────────────── ├─ GREEN_DARK_1X: #008937 ├─ GREEN_DARK_2X: #005623 └─ GREEN_DARK_3X: #00230E |
Green Black Colors: ─┬───────────────────────── ├─ GREEN_BLACK_3X: #1B5E20 ├─ GREEN_BLACK_2X: #2E7D32 └─ GREEN_BLACK_1X: #388E3C |
Green Plain Colors: ─┬───────────────────────── ├─ GREEN_PLAIN_1X: #43A047 ├─ GREEN_PLAIN_2X: #4CAf50 └─ GREEN_PLAIN_3X: #66BB6A |
Green White Colors: ─┬───────────────────────── ├─ GREEN_WHITE_1X: #81C784 ├─ GREEN_WHITE_2X: #A5D6A7 └─ GREEN_WHITE_3X: #C8E6C9 |
Green Variation
Green Pear Black: ─┬───────────────────────── ├─ GREEN_PEAR_3XB: #1B5E20 ├─ GREEN_PEAR_2XB: #2E7D32 └─ GREEN_PEAR_1XB: #388E3C Green Pear Plain: ─┬───────────────────────── ├─ GREEN_PEAR_1XP: #43A047 ├─ GREEN_PEAR_2XP: #4CAF50 └─ GREEN_PEAR_3XP: #66BB6A Green Pear White: ─┬───────────────────────── ├─ GREEN_PEAR_1XW: #81C784 ├─ GREEN_PEAR_2XW: #A5D6A7 ├─ GREEN_PEAR_3XW: #C8E6C9 └─ GREEN_PEAR_4XW: #E8F5E9 |
Green Lime Black: ─┬───────────────────────── ├─ GREEN_LIME_3XB: #33691E ├─ GREEN_LIME_2XB: #558B2F └─ GREEN_LIME_1XB: #689F38 Green Lime Plain: ─┬───────────────────────── ├─ GREEN_LIME_1XP: #7CB342 ├─ GREEN_LIME_2XP: #8BC34A └─ GREEN_LIME_3XP: #9CCC65 Green Lime White: ─┬───────────────────────── ├─ GREEN_LIME_1XW: #AED581 ├─ GREEN_LIME_2XW: #C5E1A5 ├─ GREEN_LIME_3XW: #DCEDC8 └─ GREEN_LIME_4XW: #F1F8E9 |
Green Gold Black: ─┬───────────────────────── ├─ GREEN_GOLD_3XB: #827717 ├─ GREEN_GOLD_2XB: #9E9D24 └─ GREEN_GOLD_1XB: #AFB42B Green Gold Plain: ─┬───────────────────────── ├─ GREEN_GOLD_1XP: #C0CA33 ├─ GREEN_GOLD_2XP: #CDDC39 └─ GREEN_GOLD_3XP: #D4E157 Green Gold White: ─┬───────────────────────── ├─ GREEN_GOLD_1XW: #DCE775 ├─ GREEN_GOLD_2XW: #E6EE9C ├─ GREEN_GOLD_3XW: #F0F4C3 └─ GREEN_GOLD_4XW: #F9FBE7 |
Reference site
Chorke Color Scheme is one of the important most factor. We love green and it's variation
Collection of Green Gradient
From www.bitbybitblog.com
.cki-banner-bg {
top: 5px;
width: 100%;
height: 100px;
background: #1B6B5B;
/* background-color: #000000; */
/* background-color: #0CBE88; */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33A26A', endColorstr='#1B6B5B');
background: -webkit-gradient(linear, left top, left bottom, from(#33A26A), to(#1B6B5B));
background: -moz-linear-gradient(top, #33A26A, #1B6B5B);
}
From www.phpmyadmin.net
.cki-btn-success {
background-image: -webkit-linear-gradient(top,#5cb85c 0,#419641 100%);
background-image: -o-linear-gradient(top,#5cb85c 0,#419641 100%);
background-image: -webkit-gradient(linear,left top,left bottom,from(#5cb85c),to(#419641));
background-image: linear-gradient(to bottom,#5cb85c 0,#419641 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c',endColorstr='#ff419641',GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
background-repeat: repeat-x;
border-color: #3e8f3e;
}
.cki-btn-success {
color: #fff;
background-color: #5cb85c;
border-color: #4cae4c;
}
.cki-btn-default,
.cki-btn-success {
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 1px 1px rgba(0,0,0,0.075);
box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 1px 1px rgba(0,0,0,0.075);
}
#cki-header-custom .cki-header-time {
background-color: #2A9060;
padding: 10px 0;
color: #fff;
}
#cki-header-custom .cki-header-ads {
background-color: #339966;
min-height: 60px;
padding: 10px 0;
}
.cki-banner-bg {
background: -moz-linear-gradient(center top, rgb(0, 84, 41), rgb(47, 139, 1)) repeat scroll 0% 0% transparent;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#005429), to(#2F8B01));
box-shadow: 0px 0px 1px rgb(190, 209, 185) inset;
-webkit-box-shadow: inset 0 1px 0 #CBD6CE, inset 0 -1px 0 #CBD6CE, 0 0 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: inset 0 1px 0 #CBD6CE, inset 0 -1px 0 #CBD6CE, 0 0 15px rgba(0, 0, 0, 0.07);
background-color: #007C3C;
overflow: hidden;
padding: 3px;
height: 70px;
clear: both;
margin: 0;
}
.cki-span-bg {
background-image: linear-gradient(to bottom, #393 0%, #373 100%);
border-radius: 3px;
background: #363;
margin-left: 35px;
overflow: hidden;
text-align: left;
display: block;
padding: 4px;
height: 34px;
margin: 3px;
color: #FFF;
}
.cki-btn.cki-green {
background: #50ab22;
border-top: 1px solid #7CD450;
background: -moz-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#50ab22),color-stop(45%,#3f8c13),color-stop(78%,#327311),color-stop(100%,#245c08));
background: -webkit-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%);
background: -o-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%);
background: -ms-linear-gradient(top,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%);
background: linear-gradient(to bottom,#50ab22 0%,#3f8c13 45%,#327311 78%,#245c08 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#50ab22',endColorstr='#245c08',GradientType=0);
-webkit-transition: background 150ms;
-webkit-background-size: 100% 120%;
-moz-transition: background 150ms;
-moz-background-size: 100% 120%;
transition: background 150ms;
background-position: 0 -5px;
background-size: 100% 120%;
}
.cki-banner-bg {
background-color: rgba(12,135,16,1);
background: @include filter-gradient(#0c8710, #84ba54, horizontal);
background: @include background-image(linear-gradient(left, rgba(12,135,16,1) 0%, rgba(132,186,84,1) 100%));
}
.cki-banner-bg {
// http://colorzilla.com/gradient-editor/#a9e4f7+0,d8f7ad+0,278909+100
background-color: rgb(169,228,247); // Old browsers
@include filter-gradient(#a9e4f7, #278909, horizontal); // IE6-9
@include background-image(linear-gradient(left, rgba(169,228,247,1) 0%,rgba(216,247,173,1) 0%,rgba(39,137,9,1) 100%));
}
From forums.docker.com/t/
.cki-banner-bg {
background-color: #1b5e20;
background-image: radial-gradient(circle, #4caf50 0%, #1b5e20 100%);
position: absolute;
height: 100%;
width: 100%;
z-index: -1;
}
/*.cki-banner-bg {
background: #4caf50;
background: -moz-linear-gradient(top, #4caf50 0%, #1b5e20 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #4caf50), color-stop(100%, #1b5e20));
background: -webkit-linear-gradient(top, #4caf50 0%, #1b5e20 100%);
background: -o-linear-gradient(top, #4caf50 0%, #1b5e20 100%);
background: -ms-linear-gradient(top, #4caf50 0%, #1b5e20 100%);
background: linear-gradient(to bottom, #4caf50 0%, #1b5e20 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4caf50', endColorstr='#1b5e20', GradientType=0 );
}*/
From tomcat.apache.org
.cki-banner-bg {
padding-left: 15px;
padding-right: 15px;
background-color: #4caf50;
background: linear-gradient(to bottom, #1b5e20 -10%, #4caf50 100%);
position: relative;
}
From nist.gov
.cki-featured-topics .field-featured-topic-area {
text-align: center;
font-size: 22px;
line-height: 26px;
color: #257a2d;
text-transform: uppercase;
margin-top: 0;
font-weight: 400;
}
Collection of Green Banner
Chorke banner like TP-Link
For Chorke, Inc. banner we banner graphics some things like that. Background graphics is ok. But there need correction of floating transparent gradient on top of background images.

-
Benzene Color
-
Benzene Plain