Shapes are being distorted in browser preview

I’m currently building a simple wireframe for a project (no interactions. Just shapes & text). Here’s a screengrab of it directly from Axure v9.0.0.3622 —

When I press Preview to see it in my browser (Chrome), every shape on the page looks like this:

At first I thought it may have been the ‘sketch effects’ from previous Axure versions being applied, until I realised they’re not present in the 9 Beta. So I’m not sure what’s causing this!

UPDATE 1
As soon as I changed the corner radius of all shapes to ‘0’, it fixed the problem.
It’s a corner radius problem it seems.

UPDATE 2
I noticed a 1 pixel 20% transparent ‘Border’ was applied to the shapes. Once I removed them, and set the border to ‘0’, i was able to apply round corners to the shapes, and it rendered properly

Hi there!

It looks like this issue you’re seeing happens if shapes that have a corner radius also have a semi-transparent border. Similar issues are also occurring if connectors happen to have rounded shapes. We’re currently investigating a fix for both of these issues on our end. Thanks for the detailed report! :slight_smile:

1 Like