5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/1rdgef59pv3cw.js","/creators-assets/_next/static/immutable/chunks/0zdv1ssrxkrvj.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/0gxswkth5mc6b.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/36invrtoq879v.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0j6nyijn0flqd.js","/creators-assets/_next/static/immutable/chunks/2b15v_9ruhnys.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3h1dt97hv5ik0.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/0w757zrv0hi6k.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/1h-r9oggqjick.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3sa-o_ztvtkwe.js","/creators-assets/_next/static/immutable/chunks/2051y-i4b0nnm.js"],"PostDetailCard"] 5e:I[539959,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/1rdgef59pv3cw.js","/creators-assets/_next/static/immutable/chunks/0zdv1ssrxkrvj.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/0gxswkth5mc6b.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/36invrtoq879v.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0j6nyijn0flqd.js","/creators-assets/_next/static/immutable/chunks/2b15v_9ruhnys.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3h1dt97hv5ik0.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/0w757zrv0hi6k.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/1h-r9oggqjick.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3sa-o_ztvtkwe.js","/creators-assets/_next/static/immutable/chunks/2051y-i4b0nnm.js"],"CommentSection"] 5d:T62e,

Greyscaler is the ultimate color utility for Framer. Built for product designers who demand precision, Greyscaler allows you to instantly generate perceptually uniform neutral palettes from a single seed color.

Instead of relying on rigid, standard RGB math, Greyscaler calculates color spaces using OKLCH to ensure every generated step (from 50 to 950) scales dynamically with human perception.

Core Features:

Instant Neutral Generation: Turn any hex, RGB, or HSL color into a perfectly tiered 11-step neutral color variable collection.
Canvas Extraction: Use the native magnifying EyeDropper tool to sample colors directly from your active Framer canvas.
Intelligent Dark Mode: Automatically calculate perfectly inverted dark theme variables tied directly to the same tokens in one click.
Smart Folders: Output your color trees securely into dynamic folders. Greyscaler automatically detects overlaps and increments folder names (e.g., Brand 2, Brand 3) to ensure your scales are never overwritten.
Real-time Engine: Adjust the curve strength of your color scale and watch the palette update natively via a live preview stack before adding it to your system.

Stop guessing your neutral scales. Generate a flexible, production-ready design system color foundation in seconds. Got feedback? Email me

59:[["$","$L5c",null,{"post":{"id":"019cd436-93ae-7fd8-8267-2f3fb5d66929","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"696049e2-9d26-4e30-beec-4c7907e65e1f","name":"Osbert O.","slug":"osberto","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/129610/avatar-SluAZvcMt3Cn6RmLxceZIWPV5AUvWq.jpg","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"869","resolved":true,"title":"Greyscaler","body":"$5d","bodyJson":null,"introduction":"Perceptually Uniform Greyscale","slug":"greyscaler","author":{"framerUserId":"696049e2-9d26-4e30-beec-4c7907e65e1f","name":"Osbert O.","slug":"osberto","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/129610/avatar-SluAZvcMt3Cn6RmLxceZIWPV5AUvWq.jpg","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/plugins/869-LTuyljUYJTDU5U8Cu83fB9hPHJYJPa","metadata":{"tint":"hsl(0 0% 3%)","aspectRatio":1.3333333333333333}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/plugins/869-QR5Yth24JD4mifGWH9Pzg7nSpyxpd2","metadata":{"tint":"hsl(0 0% 3%)","aspectRatio":1.3333333333333333}}],"post":null,"createdAt":"2026-03-09T09:14:21.758Z","updatedAt":"2026-03-10T00:16:29.844Z","publishedAt":"2026-03-09T20:07:52.494Z","featuredAt":null,"approvedAt":null,"type":"plugin","attributes":{"framerPluginId":"2za3aswbtm5ij1d3i49jqqe8m","paid":false,"categories":[{"id":"b238ea64-0ce9-413a-848d-43b73f0eea0f","name":"Design Workflow","slug":"design-workflow"}]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-03-09T20:07:52.494Z","updatedAt":"2026-03-09T20:07:52.494Z","reported":false}}],["$","$L5e",null,{"target":{"kind":"post","postId":"019cd436-93ae-7fd8-8267-2f3fb5d66929"},"postId":"019cd436-93ae-7fd8-8267-2f3fb5d66929","postAuthor":"$59:0:props:post:author","targetCommentId":"$undefined"}]]

Suggested for you