Turns named list of color palettes into gt chart

Source: R/gt-helpers.R

Turns named list of color palettes into gt chart

pals_to_gt(pals)

Arguments

pals

named list of palettes

Value

gt::gt chart

Examples

pals_to_gt(color_hex_palettes[1:5])

#> <style>html {
#>   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
#> }
#> 
#> #mwlefoodfi .gt_table {
#>   display: table;
#>   border-collapse: collapse;
#>   margin-left: auto;
#>   margin-right: auto;
#>   color: #333333;
#>   font-size: 16px;
#>   font-weight: normal;
#>   font-style: normal;
#>   background-color: #FFFFFF;
#>   width: auto;
#>   border-top-style: solid;
#>   border-top-width: 2px;
#>   border-top-color: #A8A8A8;
#>   border-right-style: none;
#>   border-right-width: 2px;
#>   border-right-color: #D3D3D3;
#>   border-bottom-style: solid;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #A8A8A8;
#>   border-left-style: none;
#>   border-left-width: 2px;
#>   border-left-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_heading {
#>   background-color: #FFFFFF;
#>   text-align: center;
#>   border-bottom-color: #FFFFFF;
#>   border-left-style: none;
#>   border-left-width: 1px;
#>   border-left-color: #D3D3D3;
#>   border-right-style: none;
#>   border-right-width: 1px;
#>   border-right-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_title {
#>   color: #333333;
#>   font-size: 125%;
#>   font-weight: initial;
#>   padding-top: 4px;
#>   padding-bottom: 4px;
#>   border-bottom-color: #FFFFFF;
#>   border-bottom-width: 0;
#> }
#> 
#> #mwlefoodfi .gt_subtitle {
#>   color: #333333;
#>   font-size: 85%;
#>   font-weight: initial;
#>   padding-top: 0;
#>   padding-bottom: 4px;
#>   border-top-color: #FFFFFF;
#>   border-top-width: 0;
#> }
#> 
#> #mwlefoodfi .gt_bottom_border {
#>   border-bottom-style: solid;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_col_headings {
#>   border-top-style: solid;
#>   border-top-width: 2px;
#>   border-top-color: #D3D3D3;
#>   border-bottom-style: solid;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#>   border-left-style: none;
#>   border-left-width: 1px;
#>   border-left-color: #D3D3D3;
#>   border-right-style: none;
#>   border-right-width: 1px;
#>   border-right-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_col_heading {
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   font-size: 100%;
#>   font-weight: normal;
#>   text-transform: inherit;
#>   border-left-style: none;
#>   border-left-width: 1px;
#>   border-left-color: #D3D3D3;
#>   border-right-style: none;
#>   border-right-width: 1px;
#>   border-right-color: #D3D3D3;
#>   vertical-align: bottom;
#>   padding-top: 5px;
#>   padding-bottom: 6px;
#>   padding-left: 5px;
#>   padding-right: 5px;
#>   overflow-x: hidden;
#> }
#> 
#> #mwlefoodfi .gt_column_spanner_outer {
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   font-size: 100%;
#>   font-weight: normal;
#>   text-transform: inherit;
#>   padding-top: 0;
#>   padding-bottom: 0;
#>   padding-left: 4px;
#>   padding-right: 4px;
#> }
#> 
#> #mwlefoodfi .gt_column_spanner_outer:first-child {
#>   padding-left: 0;
#> }
#> 
#> #mwlefoodfi .gt_column_spanner_outer:last-child {
#>   padding-right: 0;
#> }
#> 
#> #mwlefoodfi .gt_column_spanner {
#>   border-bottom-style: solid;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#>   vertical-align: bottom;
#>   padding-top: 5px;
#>   padding-bottom: 6px;
#>   overflow-x: hidden;
#>   display: inline-block;
#>   width: 100%;
#> }
#> 
#> #mwlefoodfi .gt_group_heading {
#>   padding: 8px;
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   font-size: 100%;
#>   font-weight: initial;
#>   text-transform: inherit;
#>   border-top-style: solid;
#>   border-top-width: 2px;
#>   border-top-color: #D3D3D3;
#>   border-bottom-style: solid;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#>   border-left-style: none;
#>   border-left-width: 1px;
#>   border-left-color: #D3D3D3;
#>   border-right-style: none;
#>   border-right-width: 1px;
#>   border-right-color: #D3D3D3;
#>   vertical-align: middle;
#> }
#> 
#> #mwlefoodfi .gt_empty_group_heading {
#>   padding: 0.5px;
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   font-size: 100%;
#>   font-weight: initial;
#>   border-top-style: solid;
#>   border-top-width: 2px;
#>   border-top-color: #D3D3D3;
#>   border-bottom-style: solid;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#>   vertical-align: middle;
#> }
#> 
#> #mwlefoodfi .gt_from_md > :first-child {
#>   margin-top: 0;
#> }
#> 
#> #mwlefoodfi .gt_from_md > :last-child {
#>   margin-bottom: 0;
#> }
#> 
#> #mwlefoodfi .gt_row {
#>   padding-top: 8px;
#>   padding-bottom: 8px;
#>   padding-left: 5px;
#>   padding-right: 5px;
#>   margin: 10px;
#>   border-top-style: solid;
#>   border-top-width: 1px;
#>   border-top-color: #D3D3D3;
#>   border-left-style: none;
#>   border-left-width: 1px;
#>   border-left-color: #D3D3D3;
#>   border-right-style: none;
#>   border-right-width: 1px;
#>   border-right-color: #D3D3D3;
#>   vertical-align: middle;
#>   overflow-x: hidden;
#> }
#> 
#> #mwlefoodfi .gt_stub {
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   font-size: 100%;
#>   font-weight: initial;
#>   text-transform: inherit;
#>   border-right-style: solid;
#>   border-right-width: 2px;
#>   border-right-color: #D3D3D3;
#>   padding-left: 12px;
#> }
#> 
#> #mwlefoodfi .gt_summary_row {
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   text-transform: inherit;
#>   padding-top: 8px;
#>   padding-bottom: 8px;
#>   padding-left: 5px;
#>   padding-right: 5px;
#> }
#> 
#> #mwlefoodfi .gt_first_summary_row {
#>   padding-top: 8px;
#>   padding-bottom: 8px;
#>   padding-left: 5px;
#>   padding-right: 5px;
#>   border-top-style: solid;
#>   border-top-width: 2px;
#>   border-top-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_grand_summary_row {
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   text-transform: inherit;
#>   padding-top: 8px;
#>   padding-bottom: 8px;
#>   padding-left: 5px;
#>   padding-right: 5px;
#> }
#> 
#> #mwlefoodfi .gt_first_grand_summary_row {
#>   padding-top: 8px;
#>   padding-bottom: 8px;
#>   padding-left: 5px;
#>   padding-right: 5px;
#>   border-top-style: double;
#>   border-top-width: 6px;
#>   border-top-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_striped {
#>   background-color: rgba(128, 128, 128, 0.05);
#> }
#> 
#> #mwlefoodfi .gt_table_body {
#>   border-top-style: solid;
#>   border-top-width: 2px;
#>   border-top-color: #D3D3D3;
#>   border-bottom-style: solid;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_footnotes {
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   border-bottom-style: none;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#>   border-left-style: none;
#>   border-left-width: 2px;
#>   border-left-color: #D3D3D3;
#>   border-right-style: none;
#>   border-right-width: 2px;
#>   border-right-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_footnote {
#>   margin: 0px;
#>   font-size: 90%;
#>   padding: 4px;
#> }
#> 
#> #mwlefoodfi .gt_sourcenotes {
#>   color: #333333;
#>   background-color: #FFFFFF;
#>   border-bottom-style: none;
#>   border-bottom-width: 2px;
#>   border-bottom-color: #D3D3D3;
#>   border-left-style: none;
#>   border-left-width: 2px;
#>   border-left-color: #D3D3D3;
#>   border-right-style: none;
#>   border-right-width: 2px;
#>   border-right-color: #D3D3D3;
#> }
#> 
#> #mwlefoodfi .gt_sourcenote {
#>   font-size: 90%;
#>   padding: 4px;
#> }
#> 
#> #mwlefoodfi .gt_left {
#>   text-align: left;
#> }
#> 
#> #mwlefoodfi .gt_center {
#>   text-align: center;
#> }
#> 
#> #mwlefoodfi .gt_right {
#>   text-align: right;
#>   font-variant-numeric: tabular-nums;
#> }
#> 
#> #mwlefoodfi .gt_font_normal {
#>   font-weight: normal;
#> }
#> 
#> #mwlefoodfi .gt_font_bold {
#>   font-weight: bold;
#> }
#> 
#> #mwlefoodfi .gt_font_italic {
#>   font-style: italic;
#> }
#> 
#> #mwlefoodfi .gt_super {
#>   font-size: 65%;
#> }
#> 
#> #mwlefoodfi .gt_footnote_marks {
#>   font-style: italic;
#>   font-size: 65%;
#> }
#> </style>
#> <div id="mwlefoodfi" style="overflow-x:auto;overflow-y:auto;width:auto;height:auto;"><table class="gt_table">
#>   
#>   <thead class="gt_col_headings">
#>     <tr>
#>       <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1">names</th>
#>       <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1">colors</th>
#>     </tr>
#>   </thead>
#>   <tbody class="gt_table_body">
#>     <tr>
#>       <td class="gt_row gt_left">Ann Arbor Optimal Nutrition</td>
#>       <td class="gt_row gt_left"><svg width="403px" height="32px" viewBox="0 0 403 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
#>   <defs>
#>     <rect id="path-1" x="1" y="1" width="400" height="30" rx="4"></rect>
#>   </defs>
#>   <g id="main" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
#>     <rect id="color_1" fill="#fcfcfc" x="1" y="1" width="80" height="30"></rect>
#>     <rect id="color_2" fill="#aaaaaa" x="81" y="1" width="80" height="30"></rect>
#>     <rect id="color_3" fill="#b4dbc0" x="161" y="1" width="80" height="30"></rect>
#>     <rect id="color_4" fill="#a7b3a5" x="241" y="1" width="80" height="30"></rect>
#>     <rect id="color_5" fill="#b56357" x="321" y="1" width="80" height="30"></rect>
#>     <g id="outer_rect">
#>       <rect stroke="#979797" stroke-width="1" x="1.5" y="1.5" width="399" height="29" rx="4"></rect>
#>       <rect stroke="#FFFFFF" stroke-width="2" x="0" y="0" width="402" height="32" rx="4"></rect>
#>     </g>
#>   </g>
#> </svg></td>
#>     </tr>
#>     <tr>
#>       <td class="gt_row gt_left">i heard youre making problems rhyme</td>
#>       <td class="gt_row gt_left"><svg width="403px" height="32px" viewBox="0 0 403 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
#>   <defs>
#>     <rect id="path-1" x="1" y="1" width="400" height="30" rx="4"></rect>
#>   </defs>
#>   <g id="main" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
#>     <rect id="color_1" fill="#9c3358" x="1" y="1" width="80" height="30"></rect>
#>     <rect id="color_2" fill="#ab3142" x="81" y="1" width="80" height="30"></rect>
#>     <rect id="color_3" fill="#b92f2c" x="161" y="1" width="80" height="30"></rect>
#>     <rect id="color_4" fill="#c82d16" x="241" y="1" width="80" height="30"></rect>
#>     <rect id="color_5" fill="#d62b00" x="321" y="1" width="80" height="30"></rect>
#>     <g id="outer_rect">
#>       <rect stroke="#979797" stroke-width="1" x="1.5" y="1.5" width="399" height="29" rx="4"></rect>
#>       <rect stroke="#FFFFFF" stroke-width="2" x="0" y="0" width="402" height="32" rx="4"></rect>
#>     </g>
#>   </g>
#> </svg></td>
#>     </tr>
#>     <tr>
#>       <td class="gt_row gt_left">the conversing abilities of a barons daughter</td>
#>       <td class="gt_row gt_left"><svg width="403px" height="32px" viewBox="0 0 403 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
#>   <defs>
#>     <rect id="path-1" x="1" y="1" width="400" height="30" rx="4"></rect>
#>   </defs>
#>   <g id="main" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
#>     <rect id="color_1" fill="#f4cee5" x="1" y="1" width="80" height="30"></rect>
#>     <rect id="color_2" fill="#e1c3ce" x="81" y="1" width="80" height="30"></rect>
#>     <rect id="color_3" fill="#cfb9b8" x="161" y="1" width="80" height="30"></rect>
#>     <rect id="color_4" fill="#bcaea1" x="241" y="1" width="80" height="30"></rect>
#>     <rect id="color_5" fill="#a9a38a" x="321" y="1" width="80" height="30"></rect>
#>     <g id="outer_rect">
#>       <rect stroke="#979797" stroke-width="1" x="1.5" y="1.5" width="399" height="29" rx="4"></rect>
#>       <rect stroke="#FFFFFF" stroke-width="2" x="0" y="0" width="402" height="32" rx="4"></rect>
#>     </g>
#>   </g>
#> </svg></td>
#>     </tr>
#>     <tr>
#>       <td class="gt_row gt_left">my mind is in the future</td>
#>       <td class="gt_row gt_left"><svg width="403px" height="32px" viewBox="0 0 403 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
#>   <defs>
#>     <rect id="path-1" x="1" y="1" width="400" height="30" rx="4"></rect>
#>   </defs>
#>   <g id="main" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
#>     <rect id="color_1" fill="#bc81e5" x="1" y="1" width="80" height="30"></rect>
#>     <rect id="color_2" fill="#ba6dd4" x="81" y="1" width="80" height="30"></rect>
#>     <rect id="color_3" fill="#b758c2" x="161" y="1" width="80" height="30"></rect>
#>     <rect id="color_4" fill="#b544b1" x="241" y="1" width="80" height="30"></rect>
#>     <rect id="color_5" fill="#b22f9f" x="321" y="1" width="80" height="30"></rect>
#>     <g id="outer_rect">
#>       <rect stroke="#979797" stroke-width="1" x="1.5" y="1.5" width="399" height="29" rx="4"></rect>
#>       <rect stroke="#FFFFFF" stroke-width="2" x="0" y="0" width="402" height="32" rx="4"></rect>
#>     </g>
#>   </g>
#> </svg></td>
#>     </tr>
#>     <tr>
#>       <td class="gt_row gt_left">hty</td>
#>       <td class="gt_row gt_left"><svg width="403px" height="32px" viewBox="0 0 403 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
#>   <defs>
#>     <rect id="path-1" x="1" y="1" width="400" height="30" rx="4"></rect>
#>   </defs>
#>   <g id="main" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
#>     <rect id="color_1" fill="#626262" x="1" y="1" width="80" height="30"></rect>
#>     <rect id="color_2" fill="#dddddd" x="81" y="1" width="80" height="30"></rect>
#>     <rect id="color_3" fill="#cccccc" x="161" y="1" width="80" height="30"></rect>
#>     <rect id="color_4" fill="#bbbbbb" x="241" y="1" width="80" height="30"></rect>
#>     <rect id="color_5" fill="#aaaaaa" x="321" y="1" width="80" height="30"></rect>
#>     <g id="outer_rect">
#>       <rect stroke="#979797" stroke-width="1" x="1.5" y="1.5" width="399" height="29" rx="4"></rect>
#>       <rect stroke="#FFFFFF" stroke-width="2" x="0" y="0" width="402" height="32" rx="4"></rect>
#>     </g>
#>   </g>
#> </svg></td>
#>     </tr>
#>   </tbody>
#>   
#>   
#> </table></div>