[{"data":1,"prerenderedAt":86},["ShallowReactive",2],{"tool-content-en-border-radius-generator":3},{"id":4,"title":5,"body":6,"description":77,"extension":78,"locale":79,"meta":80,"navigation":81,"path":82,"seo":83,"stem":84,"toolId":12,"__hash__":85},"tools\u002Ftools\u002Fen\u002Fborder-radius-generator.md","Border Radius Generator",{"type":7,"value":8,"toc":71},"minimark",[9,13,26,29,32,36,68],[10,11,5],"h2",{"id":12},"border-radius-generator",[14,15,16,17,21,22,25],"p",{},"Shape a card's corners visually and export the exact code. Choose ",[18,19,20],"strong",{},"Uniform"," to apply one value to every corner, or ",[18,23,24],{},"Four corners"," to set each corner independently — the preview updates instantly and shows how irregular corners change the silhouette.",[14,27,28],{},"Switch between pixels and percent. Percent radii are measured against the preview card's own dimensions, so they scale with the element size in your project. Every control accepts decimals.",[14,30,31],{},"The preview card includes a sample button so you can judge how tight or generous the rounding looks on real UI, not just on a plain block.",[10,33,35],{"id":34},"export","Export",[37,38,39,55],"ul",{},[40,41,42,45,46,50,51,54],"li",{},[18,43,44],{},"CSS declaration",": ",[47,48,49],"code",{},"border-radius: 16px;"," when all corners match, otherwise the four-value shorthand ",[47,52,53],{},"border-radius: 16px 24px 8px 4px;",".",[40,56,57,45,60,63,64,67],{},[18,58,59],{},"Tailwind classes",[47,61,62],{},"rounded-[16px]"," for a uniform radius, or per-corner arbitrary values like ",[47,65,66],{},"rounded-tl-[16px] rounded-tr-[24px] rounded-br-[8px] rounded-bl-[4px]"," for independent corners.",[14,69,70],{},"Your settings are remembered in the browser, and everything runs locally.",{"title":72,"searchDepth":73,"depth":73,"links":74},"",2,[75,76],{"id":12,"depth":73,"text":5},{"id":34,"depth":73,"text":35},"Preview and fine-tune CSS border-radius for one or four corners, then copy CSS or Tailwind classes.","md","en",{},true,"\u002Ftools\u002Fen\u002Fborder-radius-generator",{"title":5,"description":77},"tools\u002Fen\u002Fborder-radius-generator","Yrzn8hDjeCGlSQ3BWpnSbD0tXgic_9EABCqBHOV6zgI",1792391416505]