--- title: How Palette was made | daily.dev description: A developer recounts building Palette, an open source lightweight color picker covering popular design system palettes like Material Design, Flat UI, iOS, and... canonical: https://daily.dev/posts/how-palette-was-made-0zgwnmqkh twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: How Palette was made | daily.dev og:description: A developer recounts building Palette, an open source lightweight color picker covering popular design system palettes like Material Design, Flat UI, iOS, and... og:url: https://daily.dev/posts/how-palette-was-made-0zgwnmqkh og:image: https://api.daily.dev/og/posts/0zgwNmQKH.png og:image:alt: How Palette was made og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # How Palette was made **[zserge's blog](https://daily.dev/sources/zserge)** · 4 min read · 0 upvotes · 0 comments ## Summary A developer recounts building Palette, an open source lightweight color picker covering popular design system palettes like Material Design, Flat UI, iOS, and Windows Phone. The post explains why the project avoided Flash-based clipboard tools like Zeroclipboard, and instead used vanilla JavaScript with the HTML5 Clipboard API (added in Chrome 43) with a fallback to manual text selection via Ctrl+C, plus graceful degradation for users without JavaScript. It also covers using Harp for static site generation, Jade templates, and Flexbox for layout, all built without jQuery. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Questions this post answers ### How do I copy text to the clipboard in JavaScript without using Flash or Zeroclipboard? Select the target element's text using the Range and Selection APIs, then call document.execCommand('copy') inside a try/catch block, which works in Chrome 43 and later via the HTML5 Clipboard API. If execCommand throws (unsupported browser), leave the text selected so the user can manually press Ctrl+C to copy it. _daily.dev surfaces practical browser API workarounds like this for developers avoiding legacy plugins._ ### Why did websites use Flash-based tools like Zeroclipboard for clipboard copying around 2015? Browsers lacked a universal native JavaScript clipboard API before Chrome 43 introduced document.execCommand('copy') support, so Flash tools like Zeroclipboard were the only cross-browser way to copy text to the clipboard on click. This approach was slow, visually clunky, and increasingly unreliable since Firefox disabled Flash by default. _developers tracking browser API shifts away from Flash-era hacks can follow such changes on daily.dev._ ## Similar posts on daily.dev - [Random Color Palette : Frontend Coding Exercises](https://daily.dev/posts/random-color-palette-frontend-coding-exercises-zyukqwkck) · Kirupa · 10 upvotes · 1 comments - [Links to CSS colour palettes](https://daily.dev/posts/links-to-css-colour-palettes-9ttdrn8lj) · Julia Evans · 6 upvotes · 0 comments - [Choosing colors \(for developers\)](https://daily.dev/posts/choosing-colors-for-developers--almguv7ft) · RUBYLAND · 7 upvotes · 4 comments - [Webapp Color Picker Series](https://daily.dev/posts/webapp-color-picker-series-wnaajbtyc) · Towards Dev · 1 upvotes · 0 comments - [Fine, I’ll build my own text editor](https://daily.dev/posts/fine-i-ll-build-my-own-text-editor-mlxtdf0rd) · Lobsters · 0 upvotes · 0 comments --- Tags: [#javascript](https://daily.dev/tags/javascript), [#open-source](https://daily.dev/tags/open-source), [#css](https://daily.dev/tags/css), [#ui-design](https://daily.dev/tags/ui-design) [View this post on daily.dev](https://daily.dev/posts/how-palette-was-made-0zgwnmqkh) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"How Palette was made","url":"https://daily.dev/posts/how-palette-was-made-0zgwnmqkh","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/how-palette-was-made-0zgwnmqkh"},"datePublished":"2026-08-23T10:20:17.671Z","dateModified":"2026-08-23T10:21:53.911Z","description":"A developer recounts building Palette, an open source lightweight color picker covering popular design system palettes like Material Design, Flat UI, iOS, and...","image":"https://media.daily.dev/image/upload/s--ZrL_HSsR--/f_auto/v1722860399/public/Placeholder%2006","thumbnailUrl":"https://media.daily.dev/image/upload/s--ZrL_HSsR--/f_auto/v1722860399/public/Placeholder%2006","isAccessibleForFree":true,"articleSection":"zserge's blog","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"zserge's blog","logo":"https://media.daily.dev/image/upload/s--KQnFBOIT--/f_auto,q_auto/v1787480407/logos/zserge","url":"https://daily.dev/sources/zserge"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/how-palette-was-made-0zgwnmqkh","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"javascript,open-source,css,ui-design","timeRequired":"PT4M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"zserge's blog","item":"https://daily.dev/sources/zserge"},{"@type":"ListItem","position":3,"name":"How Palette was made"}]} {"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/how-palette-was-made-0zgwnmqkh#faq","mainEntity":[{"@type":"Question","name":"How do I copy text to the clipboard in JavaScript without using Flash or Zeroclipboard?","acceptedAnswer":{"@type":"Answer","text":"Select the target element's text using the Range and Selection APIs, then call document.execCommand('copy') inside a try/catch block, which works in Chrome 43 and later via the HTML5 Clipboard API. If execCommand throws (unsupported browser), leave the text selected so the user can manually press Ctrl+C to copy it. daily.dev surfaces practical browser API workarounds like this for developers avoiding legacy plugins."}},{"@type":"Question","name":"Why did websites use Flash-based tools like Zeroclipboard for clipboard copying around 2015?","acceptedAnswer":{"@type":"Answer","text":"Browsers lacked a universal native JavaScript clipboard API before Chrome 43 introduced document.execCommand('copy') support, so Flash tools like Zeroclipboard were the only cross-browser way to copy text to the clipboard on click. This approach was slow, visually clunky, and increasingly unreliable since Firefox disabled Flash by default. developers tracking browser API shifts away from Flash-era hacks can follow such changes on daily.dev."}}]} ```