[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"blog-categories-en-US":3,"categories-en-US":3,"resource-feralui-gradients-en-US":4,"featured-sidebar-data-en-US":3,"latest-resources-en-US":54,"alternatives-feralui-gradients-en-US":121,"related-resources-feralui-gradients-en-US":122},true,{"id":5,"name":6,"slug":7,"url":8,"date_updated":9,"images_other":9,"tagline":10,"description":11,"seo":12,"features":15,"pros":22,"cons":28,"best_for":32,"cover":33,"icon":9,"pricing":34,"platform":35,"github_url":37,"twitter_url":9,"discord_url":9,"dribbble_url":9,"pricing_tiers":38,"views_count":39,"featured_rank":9,"categories":40,"tags":45,"files":9},861,"FeralUI Gradient Builder","feralui-gradients","https:\u002F\u002Fferalui.dev\u002Fgradients",null,"Playful, physics-driven gradient builder for Tailwind CSS","FeralUI Gradient Builder is an interactive, physics-driven tool for creating beautiful CSS and Tailwind CSS gradients. Part of the FeralUI library of playful React elements, it features a unique, tactile interface where gradient controls respond with real-time physics animations. Design linear and radial gradients, adjust color stops visually, preview instantly, and copy the generated CSS or Tailwind CSS code to your clipboard. The tool is free, open-source, and works entirely in the browser with no account required.",{"title":13,"meta_description":14},"FeralUI Gradient Builder — Interactive CSS & Tailwind Gradient Tool","FeralUI Gradient Builder is a free, open-source tool for creating CSS and Tailwind CSS gradients with a playful physics-driven interface. Preview in real time and copy code instantly.",[16,17,18,19,20,21],"Interactive physics-driven gradient Builder interface","Linear and radial gradient support","Real-time visual preview as you tweak colors","CSS and Tailwind CSS code output","Free and open-source with no account needed","Part of the FeralUI playful React component library",[23,24,25,26,27],"Unique physics-based interaction makes gradient building fun","Instant copy of production-ready CSS and Tailwind code","Free to use with no registration","Open-source with active development","Real-time preview for immediate feedback",[29,30,31],"Part of a larger experimental library, design may change","Limited to a single gradient at a time","No gradient presets or saved collections","Frontend developers and designers who want a fun, interactive way to create CSS and Tailwind CSS gradients with real-time preview and one-click code copying.","7ebaf15a-33a1-4f03-bd92-88ad52b886e5.webp","free",[36],"Web","https:\u002F\u002Fgithub.com\u002Fmortspace\u002Fferalui",{"free":3},0,[41],{"name":42,"slug":43,"sub_categories":44},"Colors & Palettes","colors-palettes",[],[46,48,51],{"name":47,"slug":34},"Free",{"name":49,"slug":50},"Open Source","open-source",{"name":52,"slug":53},"Colors","colors",[55,76,82,95],{"id":56,"url":57,"icon":9,"name":58,"slug":59,"tags":60,"cover":72,"tagline":73,"is_featured":74,"date_created":75,"date_updated":9},862,"https:\u002F\u002Fdeveloper.apple.com\u002Fdesign\u002Fresources\u002F","Apple Design Resources","apple-design-resources",[61,62,64,66,68,70],{"seo":9,"name":47,"slug":34},{"seo":9,"name":9,"slug":63},"fonts",{"seo":9,"name":9,"slug":65},"icons",{"seo":9,"name":9,"slug":67},"mockups",{"seo":9,"name":9,"slug":69},"ui-kits",{"seo":9,"name":9,"slug":71},"design-systems","39af338d-2e06-4c05-bfcb-b33066ed9bb7.webp","Official Apple design templates, UI kits, fonts, and tools",false,"2026-07-16T01:44:01.585569+00:00",{"id":5,"url":8,"icon":9,"name":6,"slug":7,"tags":77,"cover":33,"tagline":10,"is_featured":74,"date_created":81,"date_updated":9},[78,79,80],{"seo":9,"name":47,"slug":34},{"seo":9,"name":49,"slug":50},{"seo":9,"name":9,"slug":53},"2026-07-16T01:39:25.742464+00:00",{"id":83,"url":84,"icon":9,"name":85,"slug":86,"tags":87,"cover":92,"tagline":93,"is_featured":74,"date_created":94,"date_updated":9},860,"https:\u002F\u002Fviewport-ui.design\u002F","Viewport UI","viewport-ui",[88,89,90],{"seo":9,"name":47,"slug":34},{"seo":9,"name":9,"slug":69},{"seo":9,"name":9,"slug":91},"inspiration","7a4e7938-e9b1-4f8b-9886-37b683ddd8f6.webp","UI curated experiences for your inspiration","2026-07-07T06:28:48.469215+00:00",{"id":96,"url":97,"icon":9,"name":98,"slug":99,"tags":100,"cover":118,"tagline":119,"is_featured":74,"date_created":120,"date_updated":9},859,"https:\u002F\u002F21st.dev\u002F","21st.dev","21st-dev",[101,104,106,107,110,111,112,114,116],{"seo":9,"name":102,"slug":103},"AI Powered","ai-powered",{"seo":9,"name":9,"slug":105},"ai",{"seo":9,"name":47,"slug":34},{"seo":9,"name":108,"slug":109},"Freemium","freemium",{"seo":9,"name":9,"slug":69},{"seo":9,"name":9,"slug":71},{"seo":9,"name":9,"slug":113},"prototyping",{"seo":9,"name":9,"slug":115},"no-code",{"seo":9,"name":9,"slug":117},"productivity","79e67612-7a6f-45be-a799-e872786fc4ed.webp","Hand-crafted React components and templates — not AI slop","2026-07-07T06:23:36.061553+00:00",[],[123,135,144],{"url":124,"icon":9,"name":125,"slug":126,"tags":127,"cover":132,"tagline":133,"is_featured":3,"date_created":134,"date_updated":9},"https:\u002F\u002Fcolorhunt.co","Color Hunt","color-hunt",[128,129,130],{"seo":9,"name":9,"slug":53},{"seo":9,"name":47,"slug":34},{"seo":9,"name":9,"slug":131},"gradient","e4a2e456-fabc-4bbf-8729-ecaf1cbfcbb6.webp","A curated collection of beautiful color palettes for designers and artists","2026-06-16T07:14:22.345664+00:00",{"url":136,"icon":9,"name":137,"slug":138,"tags":139,"cover":141,"tagline":142,"is_featured":74,"date_created":143,"date_updated":9},"https:\u002F\u002Folivia-tsui.github.io\u002Fct\u002F","World's Best Scale Tool","worlds-best-scale-tool",[140],{"seo":9,"name":9,"slug":53},"eb5afb81-91ac-496d-96b6-bd870afbc2a8.webp","Advanced color scale and palette generation tool","2026-06-24T04:31:04.697212+00:00",{"url":145,"icon":9,"name":146,"slug":147,"tags":148,"cover":150,"tagline":151,"is_featured":74,"date_created":152,"date_updated":9},"https:\u002F\u002Fwww.tints.dev\u002F","Tailwind CSS Color Generator","tailwind-css-color-generator",[149],{"seo":9,"name":9,"slug":53},"bd6eba7c-091e-4cfa-83c6-a7f3392e1032.webp","Tailwind CSS 11-color palette generator and API","2026-06-24T04:30:57.92162+00:00"]