Skip to content

Commit

Permalink
Adding examples for RAL® colors
Browse files Browse the repository at this point in the history
  • Loading branch information
@S1SYPHOS
S1SYPHOS committed May 1, 2019
1 parent 5775463 commit cb99c75
Show file tree
Hide file tree
Showing 5 changed files with 8,794 additions and 100 deletions.
2 changes: 2 additions & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,5 +35,7 @@ We assume neither ownership nor intellectual property of any kind - color codes
- [x] Introduce natural sorting for set `graphics-design`
- [x] ~~Deleting~~ Skipping entries after being moved to their respective list
- [x] Filtering neons, pastels & metallics
- [ ] Adding copyright notice for RAL® (XML + GPL)
- [x] Adding examples for RAL®
- [ ] Making use of CLI arguments
- [ ] Combining `fetch.py` & `fetchRAL.py`
177 changes: 78 additions & 99 deletions examples/index.html → examples/pantone/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,19 +40,22 @@ <h1>PANTONE® color palettes</h1>

<!-- CREATING TABLE OF CONTENTS -->
<ul> <li>
<a href="#coty-20-colors-">CotY (20 Colors)</a>
</li>
<li>
<a href="#sp-110-colors-">SP (110 Colors)</a>
</li>
<li>
<a href="#tcx-1453-colors-">TCX (1453 Colors)</a>
<a href="#tcx-1438-colors-">TCX (1438 Colors)</a>
</li>
<li>
<a href="#tn-21-colors-">TN (21 Colors)</a>
</li>
<li>
<a href="#tpg-378-colors-">TPG (378 Colors)</a>
<a href="#tpg-377-colors-">TPG (377 Colors)</a>
</li>
<li>
<a href="#tpx-481-colors-">TPX (481 Colors)</a>
<a href="#tpx-477-colors-">TPX (477 Colors)</a>
</li>
<li>
<a href="#c-1861-colors-">C (1861 Colors)</a>
Expand All @@ -62,9 +65,6 @@ <h1>PANTONE® color palettes</h1>
</li>
<li>
<a href="#mc-600-colors-">MC (600 Colors)</a>
</li>
<li>
<a href="#mu-7-colors-">MU (7 Colors)</a>
</li>
<li>
<a href="#nc-56-colors-">NC (56 Colors)</a>
Expand Down Expand Up @@ -102,7 +102,72 @@ <h1>PANTONE® color palettes</h1>
</ul>

<!-- CREATING GRID -->
<h2 id="sp-110-colors-">
<h2 id="coty-20-colors-">
CotY (20 Colors) - <a href="#">Back to top &uarr;</a>
</h2>

<div class="grid"> <div class="grid_item" style="background-color: #98B4D4" data-clipboard-text="#98B4D4">
<h3>Cerulean</h3>
</div>
<div class="grid_item" style="background-color: #C3447A" data-clipboard-text="#C3447A">
<h3>Fuchsia Rose</h3>
</div>
<div class="grid_item" style="background-color: #BF1932" data-clipboard-text="#BF1932">
<h3>True Red</h3>
</div>
<div class="grid_item" style="background-color: #7BC4C4" data-clipboard-text="#7BC4C4">
<h3>Aqua Sky</h3>
</div>
<div class="grid_item" style="background-color: #E2583E" data-clipboard-text="#E2583E">
<h3>Tigerlily</h3>
</div>
<div class="grid_item" style="background-color: #53B0AE" data-clipboard-text="#53B0AE">
<h3>Blue Turquoise</h3>
</div>
<div class="grid_item" style="background-color: #DECDBE" data-clipboard-text="#DECDBE">
<h3>Sand Dollar</h3>
</div>
<div class="grid_item" style="background-color: #9B1B30" data-clipboard-text="#9B1B30">
<h3>Chili Pepper</h3>
</div>
<div class="grid_item" style="background-color: #5A5B9F" data-clipboard-text="#5A5B9F">
<h3>Blue Iris</h3>
</div>
<div class="grid_item" style="background-color: #45B5AA" data-clipboard-text="#45B5AA">
<h3>Turquoise</h3>
</div>
<div class="grid_item" style="background-color: #D65076" data-clipboard-text="#D65076">
<h3>Honeysuckle</h3>
</div>
<div class="grid_item" style="background-color: #DD4124" data-clipboard-text="#DD4124">
<h3>Tangerine Tango</h3>
</div>
<div class="grid_item" style="background-color: #009473" data-clipboard-text="#009473">
<h3>Emerald</h3>
</div>
<div class="grid_item" style="background-color: #B163A3" data-clipboard-text="#B163A3">
<h3>Radiant Orchid</h3>
</div>
<div class="grid_item" style="background-color: #964F4C" data-clipboard-text="#964F4C">
<h3>Marsala</h3>
</div>
<div class="grid_item" style="background-color: #95AAD3" data-clipboard-text="#95AAD3">
<h3>Serenity</h3>
</div>
<div class="grid_item" style="background-color: #F7CAC9" data-clipboard-text="#F7CAC9">
<h3>Rose Quartz</h3>
</div>
<div class="grid_item" style="background-color: #88B04B" data-clipboard-text="#88B04B">
<h3>Greenery</h3>
</div>
<div class="grid_item" style="background-color: #5F4B8B" data-clipboard-text="#5F4B8B">
<h3>Ultra Violet</h3>
</div>
<div class="grid_item" style="background-color: #FF6F61" data-clipboard-text="#FF6F61">
<h3>Living Coral</h3>
</div>

</div> <h2 id="sp-110-colors-">
SP (110 Colors) - <a href="#">Back to top &uarr;</a>
</h2>

Expand Down Expand Up @@ -437,8 +502,8 @@ <h3>5Y01 SP</h3>
<h3>2Y01 SP</h3>
</div>

</div> <h2 id="tcx-1453-colors-">
TCX (1453 Colors) - <a href="#">Back to top &uarr;</a>
</div> <h2 id="tcx-1438-colors-">
TCX (1438 Colors) - <a href="#">Back to top &uarr;</a>
</h2>

<div class="grid"> <div class="grid_item" style="background-color: #2E272A" data-clipboard-text="#2E272A">
Expand Down Expand Up @@ -755,9 +820,6 @@ <h3>Columbia</h3>
</div>
<div class="grid_item" style="background-color: #009B5C" data-clipboard-text="#009B5C">
<h3>Bright Green</h3>
</div>
<div class="grid_item" style="background-color: #009473" data-clipboard-text="#009473">
<h3>Emerald</h3>
</div>
<div class="grid_item" style="background-color: #00A170" data-clipboard-text="#00A170">
<h3>Mint</h3>
Expand Down Expand Up @@ -923,9 +985,6 @@ <h3>Online Lime</h3>
</div>
<div class="grid_item" style="background-color: #44BBCA" data-clipboard-text="#44BBCA">
<h3>Capri</h3>
</div>
<div class="grid_item" style="background-color: #45B5AA" data-clipboard-text="#45B5AA">
<h3>Turquoise</h3>
</div>
<div class="grid_item" style="background-color: #34292A" data-clipboard-text="#34292A">
<h3>Ganache</h3>
Expand Down Expand Up @@ -1400,9 +1459,6 @@ <h3>Periscope</h3>
</div>
<div class="grid_item" style="background-color: #49494D" data-clipboard-text="#49494D">
<h3>Gray Pinstripe</h3>
</div>
<div class="grid_item" style="background-color: #5A5B9F" data-clipboard-text="#5A5B9F">
<h3>Blue Iris</h3>
</div>
<div class="grid_item" style="background-color: #4D4B50" data-clipboard-text="#4D4B50">
<h3>Blackened Pearl</h3>
Expand Down Expand Up @@ -1454,12 +1510,6 @@ <h3>Green Spruce</h3>
</div>
<div class="grid_item" style="background-color: #599F99" data-clipboard-text="#599F99">
<h3>Agate Green</h3>
</div>
<div class="grid_item" style="background-color: #53B0AE" data-clipboard-text="#53B0AE">
<h3>Blue Turquoise</h3>
</div>
<div class="grid_item" style="background-color: #88B04B" data-clipboard-text="#88B04B">
<h3>Greenery</h3>
</div>
<div class="grid_item" style="background-color: #582B36" data-clipboard-text="#582B36">
<h3>Windsor Wine</h3>
Expand Down Expand Up @@ -1538,9 +1588,6 @@ <h3>Magnet</h3>
</div>
<div class="grid_item" style="background-color: #5A4769" data-clipboard-text="#5A4769">
<h3>Loganberry</h3>
</div>
<div class="grid_item" style="background-color: #5F4B8B" data-clipboard-text="#5F4B8B">
<h3>Ultra Violet</h3>
</div>
<div class="grid_item" style="background-color: #574D35" data-clipboard-text="#574D35">
<h3>Dark Olive</h3>
Expand Down Expand Up @@ -2144,9 +2191,6 @@ <h3>Dusty Jade Green</h3>
</div>
<div class="grid_item" style="background-color: #82C2C7" data-clipboard-text="#82C2C7">
<h3>Tibetan Stone</h3>
</div>
<div class="grid_item" style="background-color: #7BC4C4" data-clipboard-text="#7BC4C4">
<h3>Aqua Sky</h3>
</div>
<div class="grid_item" style="background-color: #97BC62" data-clipboard-text="#97BC62">
<h3>Bright Lime Green</h3>
Expand Down Expand Up @@ -2465,9 +2509,6 @@ <h3>Green Glow</h3>
</div>
<div class="grid_item" style="background-color: #B2E79F" data-clipboard-text="#B2E79F">
<h3>Paradise Green</h3>
</div>
<div class="grid_item" style="background-color: #9B1B30" data-clipboard-text="#9B1B30">
<h3>Chili Pepper</h3>
</div>
<div class="grid_item" style="background-color: #9D202F" data-clipboard-text="#9D202F">
<h3>Scarlet Sage</h3>
Expand Down Expand Up @@ -2690,9 +2731,6 @@ <h3>Magenta Haze</h3>
</div>
<div class="grid_item" style="background-color: #A86217" data-clipboard-text="#A86217">
<h3>Honey Ginger</h3>
</div>
<div class="grid_item" style="background-color: #964F4C" data-clipboard-text="#964F4C">
<h3>Marsala</h3>
</div>
<div class="grid_item" style="background-color: #A15325" data-clipboard-text="#A15325">
<h3>Autumnal</h3>
Expand Down Expand Up @@ -3197,9 +3235,6 @@ <h3>Fair Aqua</h3>
</div>
<div class="grid_item" style="background-color: #BCD9C8" data-clipboard-text="#BCD9C8">
<h3>Misty Jade</h3>
</div>
<div class="grid_item" style="background-color: #BF1932" data-clipboard-text="#BF1932">
<h3>True Red</h3>
</div>
<div class="grid_item" style="background-color: #C6174E" data-clipboard-text="#C6174E">
<h3>Virtual Pink</h3>
Expand Down Expand Up @@ -3797,9 +3832,6 @@ <h3>Meadow Mist</h3>
</div>
<div class="grid_item" style="background-color: #D6DEC9" data-clipboard-text="#D6DEC9">
<h3>Canary Green</h3>
</div>
<div class="grid_item" style="background-color: #DD4124" data-clipboard-text="#DD4124">
<h3>Tangerine Tango</h3>
</div>
<div class="grid_item" style="background-color: #DC343B" data-clipboard-text="#DC343B">
<h3>Poppy Red</h3>
Expand Down Expand Up @@ -4019,9 +4051,6 @@ <h3>Puffin's Bill</h3>
</div>
<div class="grid_item" style="background-color: #E74A33" data-clipboard-text="#E74A33">
<h3>Mandarin Red</h3>
</div>
<div class="grid_item" style="background-color: #E2583E" data-clipboard-text="#E2583E">
<h3>Tigerlily</h3>
</div>
<div class="grid_item" style="background-color: #EA6676" data-clipboard-text="#EA6676">
<h3>Sun Kissed Coral</h3>
Expand Down Expand Up @@ -4172,9 +4201,6 @@ <h3>Tapioca</h3>
</div>
<div class="grid_item" style="background-color: #DBCBBD" data-clipboard-text="#DBCBBD">
<h3>Pink Tint</h3>
</div>
<div class="grid_item" style="background-color: #DECDBE" data-clipboard-text="#DECDBE">
<h3>Sand Dollar</h3>
</div>
<div class="grid_item" style="background-color: #D7CBC4" data-clipboard-text="#D7CBC4">
<h3>Crystal Gray</h3>
Expand Down Expand Up @@ -4688,9 +4714,6 @@ <h3>Sugar Swizzle</h3>
</div>
<div class="grid_item" style="background-color: #F0EDE5" data-clipboard-text="#F0EDE5">
<h3>Coconut Milk</h3>
</div>
<div class="grid_item" style="background-color: #FF6F61" data-clipboard-text="#FF6F61">
<h3>Living Coral</h3>
</div>
<div class="grid_item" style="background-color: #FF7F6A" data-clipboard-text="#FF7F6A">
<h3>Fresh Salmon</h3>
Expand Down Expand Up @@ -4769,9 +4792,6 @@ <h3>Veiled Rose</h3>
</div>
<div class="grid_item" style="background-color: #F7CDC7" data-clipboard-text="#F7CDC7">
<h3>Pink Salt</h3>
</div>
<div class="grid_item" style="background-color: #F7CAC9" data-clipboard-text="#F7CAC9">
<h3>Rose Quartz</h3>
</div>
<div class="grid_item" style="background-color: #FBD897" data-clipboard-text="#FBD897">
<h3>Golden Haze</h3>
Expand Down Expand Up @@ -4869,8 +4889,8 @@ <h3>Cotton Candy</h3>
<h3>Orange Pop</h3>
</div>

</div> <h2 id="tpg-378-colors-">
TPG (378 Colors) - <a href="#">Back to top &uarr;</a>
</div> <h2 id="tpg-377-colors-">
TPG (377 Colors) - <a href="#">Back to top &uarr;</a>
</h2>

<div class="grid"> <div class="grid_item" style="background-color: #006FAF" data-clipboard-text="#006FAF">
Expand Down Expand Up @@ -5028,9 +5048,6 @@ <h3>Neutral Gray</h3>
</div>
<div class="grid_item" style="background-color: #8B8DB2" data-clipboard-text="#8B8DB2">
<h3>Persian Violet</h3>
</div>
<div class="grid_item" style="background-color: #95AAD3" data-clipboard-text="#95AAD3">
<h3>Serenity</h3>
</div>
<div class="grid_item" style="background-color: #89999B" data-clipboard-text="#89999B">
<h3>Silver Blue</h3>
Expand Down Expand Up @@ -6008,8 +6025,8 @@ <h3>Pearl</h3>
<h3>Heavenly Pink</h3>
</div>

</div> <h2 id="tpx-481-colors-">
TPX (481 Colors) - <a href="#">Back to top &uarr;</a>
</div> <h2 id="tpx-477-colors-">
TPX (477 Colors) - <a href="#">Back to top &uarr;</a>
</h2>

<div class="grid"> <div class="grid_item" style="background-color: #004D8C" data-clipboard-text="#004D8C">
Expand Down Expand Up @@ -6869,9 +6886,6 @@ <h3>Wet Weather</h3>
</div>
<div class="grid_item" style="background-color: #9DAA4A" data-clipboard-text="#9DAA4A">
<h3>Dark Citron</h3>
</div>
<div class="grid_item" style="background-color: #98B4D4" data-clipboard-text="#98B4D4">
<h3>Cerulean</h3>
</div>
<div class="grid_item" style="background-color: #BAB83A" data-clipboard-text="#BAB83A">
<h3>Apple Green</h3>
Expand Down Expand Up @@ -6938,9 +6952,6 @@ <h3>Cool Blue</h3>
</div>
<div class="grid_item" style="background-color: #C7B533" data-clipboard-text="#C7B533">
<h3>Warm Olive</h3>
</div>
<div class="grid_item" style="background-color: #B163A3" data-clipboard-text="#B163A3">
<h3>Radiant Orchid</h3>
</div>
<div class="grid_item" style="background-color: #AE4F93" data-clipboard-text="#AE4F93">
<h3>Purple Orchid</h3>
Expand Down Expand Up @@ -7067,9 +7078,6 @@ <h3>Rose Red</h3>
</div>
<div class="grid_item" style="background-color: #C7458B" data-clipboard-text="#C7458B">
<h3>Raspberry Rose</h3>
</div>
<div class="grid_item" style="background-color: #C3447A" data-clipboard-text="#C3447A">
<h3>Fuchsia Rose</h3>
</div>
<div class="grid_item" style="background-color: #D361A3" data-clipboard-text="#D361A3">
<h3>Phlox Pink</h3>
Expand Down Expand Up @@ -7202,9 +7210,6 @@ <h3>Teaberry</h3>
</div>
<div class="grid_item" style="background-color: #CD4E7C" data-clipboard-text="#CD4E7C">
<h3>Pink Flambé</h3>
</div>
<div class="grid_item" style="background-color: #D65076" data-clipboard-text="#D65076">
<h3>Honeysuckle</h3>
</div>
<div class="grid_item" style="background-color: #C75F4E" data-clipboard-text="#C75F4E">
<h3>Ginger</h3>
Expand Down Expand Up @@ -20377,32 +20382,6 @@ <h3>10398 C</h3>
<h3>10399 C</h3>
</div>

</div> <h2 id="mu-7-colors-">
MU (7 Colors) - <a href="#">Back to top &uarr;</a>
</h2>

<div class="grid"> <div class="grid_item" style="background-color: #AD986E" data-clipboard-text="#AD986E">
<h3>871 U</h3>
</div>
<div class="grid_item" style="background-color: #AC936E" data-clipboard-text="#AC936E">
<h3>872 U</h3>
</div>
<div class="grid_item" style="background-color: #AE906F" data-clipboard-text="#AE906F">
<h3>873 U</h3>
</div>
<div class="grid_item" style="background-color: #AE8F6F" data-clipboard-text="#AE8F6F">
<h3>874 U</h3>
</div>
<div class="grid_item" style="background-color: #B18B74" data-clipboard-text="#B18B74">
<h3>875 U</h3>
</div>
<div class="grid_item" style="background-color: #B08770" data-clipboard-text="#B08770">
<h3>876 U</h3>
</div>
<div class="grid_item" style="background-color: #B4B7B9" data-clipboard-text="#B4B7B9">
<h3>877 U</h3>
</div>

</div> <h2 id="nc-56-colors-">
NC (56 Colors) - <a href="#">Back to top &uarr;</a>
</h2>
Expand Down
2 changes: 1 addition & 1 deletion examples/index.php → examples/pantone/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
ini_set('display_errors', 1);
// GLOBAL FUNCTIONS & VARIABLES

$files = glob('../pantone/json/*/*.json');
$files = glob('../../pantone/json/*/*.json');


// See https://stackoverflow.com/a/34244525
Expand Down

0 comments on commit cb99c75

Please sign in to comment.