Chorke Color Scheme: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
|||
(35 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 == | == 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://ibblportal.islamibankbd.com/indexLogin.do IBBL Banner] | ||
# [https:// | # [https://www.overleaf.com/gallery/tagged/book/page/3 LaTex Theme] | ||
# [https://community.jaspersoft.com Download Now] | # [https://community.jaspersoft.com Download Now] | ||
# [http://www. | # [http://www.colorzilla.com/gradient-editor Gradient Editor ] | ||
# [http://doc.chorke.org/theme/material/#!/app/matcolors Angle Matcolors] | # [http://doc.chorke.org/theme/material/#!/app/matcolors Angle Matcolors] | ||
# [https://www.nist.gov '''Featured Topics'''] | |||
# [https://www.phpmyadmin.net Gradient Button] | |||
# [https://sourceforge.net/projects/jasperstudio Download Button] | |||
# [https://www.cssmatic.com/gradient-generator Gradient Generator] | # [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] | # [https://mycolor.space/gradient mycolor.space/gradient] | ||
# [https://forums.docker.com/t/ | # [http://www.baeldung.com/hikaricp Download Button & Banner] | ||
# [https://forums.docker.com/t/ forums.docker.com/banner] | |||
# [https://tomcat.apache.org/ tomcat.apache.org/banner] | |||
# [https://www.channelionline.com/ channelionline.com/banner] | |||
|} | |||
== Collection of Green Gradient == | == Collection of Green Gradient == | ||
Line 54: | Line 179: | ||
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 1px 1px rgba(0,0,0,0.075); | -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); | 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> | </syntaxhighlight> | ||
Line 132: | Line 272: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
=== From [https://forums.docker.com/t/ | === From [https://forums.docker.com/t/ forums.docker.com/t/] === | ||
<syntaxhighlight lang="scss"> | <syntaxhighlight lang="scss"> | ||
.cki-banner-bg { | .cki-banner-bg { | ||
Line 154: | Line 294: | ||
}*/ | }*/ | ||
</syntaxhighlight> | </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 == | == Collection of Green Banner == | ||
=== Chorke banner like TP-Link === | === 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. | 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| | [[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 17: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);
}
From www.channelionline.com
#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;
}
From ibblportal.islamibankbd.com
.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;
}
From sourceforge.net/projects/jasperstudio
.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;
}
From community.jaspersoft.com
.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%;
}
From cssmatic.com/gradient-generator
.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%));
}
From colorzilla.com/gradient-editor/
.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.
Smart Health Standards Forum
-
Benzene Color
-
Benzene Plain