1import{e as g,f,o as r,c as s,a as t,F as y,r as x,b as o,w as d,g as b,t as n,d as a,_,h as k}from"./BYXglTKb.js";import{_ as w}from"./BZUdamNI.js";import{_ as v}from"./BfJwa2QR.js";import{_ as D}from"./5s-d3txB.js";const S={class:"space-y-10"},F={class:"space-y-4"},q={class:"grid grid-cols-1 gap-4 sm:grid-cols-2"},N={class:"mb-1 text-sm font-medium text-highlighted"},G={key:0},I={key:1},P={class:"text-sm text-gray-500 dark:text-gray-400"},z={class:"space-y-4"},M={class:"text-base text-gray-500 dark:text-gray-400"},T=g({__name:"about",setup(C){f({title:"About â Dither it!"});const c=[{icon:"ð",title:"Privacy First",description:"100% client-side. Your images never leave your device â no uploads, no servers."},{icon:"ð",title:"Multiple Dithering Methods",description:"Supported dithering methods include: error diffusion, Bayer ordered, blue noise, and Riemersma."},{icon:"ð¨",title:"Custom Palette Editor",description:"16 built-in presets plus a full editor to build, save, import, and export your own palettes."},{icon:"ð¼ï¸",title:"Multi-Image Gallery",description:"Upload and process multiple images at once, then bulk download as a ZIP."},{icon:"ð¹ï¸",title:"Pixel Scale",description:"Make the pixels bigger for a chunky, pixel art look."},{icon:"ð",title:"File Format Support",description:"Accepts any image format your browser supports, including animated GIFs. Export as PNG, JPG, SVG, or GIF."}];return(V,e)=>{const p=b,u=w,h=_,l=v,m=D;return r(),s("div",S,[e[7]||(e[7]=t("p",{class:"text-base leading-relaxed text-gray-500 dark:text-gray-400"}," Dither it! is a free website for dithering images, an image processing technique that reduces the number of colors used to render an image. ",-1)),t("section",F,[e[0]||(e[0]=t("h2",{class:"text-xl font-semibold text-gray-800 dark:text-gray-100"}," Features ",-1)),t("div",q,[(r(),s(y,null,x(c,i=>o(u,{key:i.title,ui:{body:"p-3 sm:p-3"}},{default:d(()=>[t("p",N,[i.icon.startsWith("i-")?(r(),s("span",G,[o(p,{name:i.icon,class:"size-4 text-[--ui-primary]"},null,8,["name"])])):(r(),s("span",I,n(i.icon),1)),a(" "+n(i.title),1)]),t("p",P,n(i.description),1)]),_:2},1024)),64))])]),t("section",z,[e[4]||(e[4]=t("h2",{class:"text-xl font-semibold text-gray-800 dark:text-gray-100"}," What is Dithering? ",-1)),e[5]||(e[5]=t("p",{class:"text-base leading-relaxed text-gray-500 dark:text-gray-400"}," Dithering is a method for trying to make an image look good while reducing the number of colors it uses, or as Wikipedia puts it: ",-1)),e[6]||(e[6]=t("blockquote",{class:"border-l-4 border-gray-100 pl-4 dark:border-gray-800"},[t("p",{class:"italic leading-relaxed text-gray-500 dark:text-gray-400"},' Dithering is used in computer graphics to create the illusion of "color depth" in images with a limited color palette â a technique also known as color quantization. In a dithered image, colors that are not available in the palette are approximated by a diffusion of colored pixels from within the available palette. The human eye perceives the diffusion as a mixture of the colors within it. Dithered images, particularly those with relatively few colors, can often be distinguished by a characteristic graininess or speckled appearance. ')],-1)),t("p",M,[e[2]||(e[2]=a(" For more information, see this ",-1)),o(h,{to:"/resources",class:"text-[--ui-primary] underline underline-offset-2 hover:opacity-80"},{default:d(()=>[...e[1]||(e[1]=[a(" list of dithering resources ",-1)])]),_:1}),e[3]||(e[3]=a(" from around the web: explainers, algorithms, examples, and more. ",-1))])]),o(l),e[8]||(e[8]=k('<section class="space-y-4"><h2 class="text-xl font-semibold text-gray-800 dark:text-gray-100"> About this site </h2><div class="space-y-3 text-base leading-relaxed text-gray-500 dark:text-gray-400"><p> Dither it! is built by Alex Harris. </p><p> It was inspired by a blog post from <a href="https://solar.lowtechmagazine.com" target="_blank" rel="noopener noreferrer" class="text-[--ui-primary] underline underline-offset-2 hover:opacity-80">Low-tech Magazine</a> about how to reduce the energy usage associated with running websites. One method discussed was to reduce full color images to dithered images with very few colors and subsequently smaller file sizes. Ensuing discussion clarified that there are other, more modern ways to compress images (try <a href="https://squoosh.app" target="_blank" rel="noopener noreferrer" class="text-[--ui-primary] underline underline-offset-2 hover:opacity-80">Squoosh</a>) which achieve reduced file sizes while maintaining color. Nonetheless, dithering is a fun technique that looks cool and is interesting to learn about. </p><p> The Dither it! source code is freely available on the <a href="https://github.com/alexharris/ditherit" target="_blank" rel="noopener noreferrer" class="text-[--ui-primary] underline underline-offset-2 hover:opacity-80">Dither it! Github page</a>. Please feel free to contribute, share or pilfer. </p><p> Thanks to <a href="https://github.com/leeoniya/RgbQuant.js" target="_blank" rel="noopener noreferrer" class="text-[--ui-primary] underline underline-offset-2 hover:opacity-80">Leon Sorokin</a> for making RgbQuant.js. </p></div></section>',1)),o(l),t("section",null,[o(m)])])}}});
1export{T as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.