# Rounded card corners 'hack' **URL:** \ **Category:** Lounge (Discussions)\ **Tags:** ui\ **Created:** [June 3, 2024, 6:50pm UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139 "2024-06-03T18:50:36Z")\ **Posts on this page:** 13\ **Page:** 1
**Author:** ![rivet](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/rivet/32/1727_2.png) [@rivet](https://the.fmsoup.org/u/rivet)\ **Post date:** [June 3, 2024, 6:50pm UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/1 "2024-06-03T18:50:37Z")
the attached zip has four svg corner icons if interested ![rounded card corners](https://canada1.discourse-cdn.com/flex030/uploads/fmsoup/original/2X/a/aa05c49a109a49108efc509a6973e86c7439b34f.jpeg) [rounded card corners.fmp12.zip](https://the.fmsoup.org/uploads/short-url/7hedLfV3VKyZ64pFIAoeLCETTui.zip) (294.0 KB) ---
**Author:** ![Malcolm](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/malcolm/32/196_2.png) [@Malcolm](https://the.fmsoup.org/u/Malcolm)\ **Post date:** [June 4, 2024, 6:57am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/2 "2024-06-04T06:57:06Z")
nice work. It's a great visual effect. ---
**Author:** ![cheesus](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/cheesus/32/182_2.png) [@cheesus](https://the.fmsoup.org/u/cheesus)\ **Post date:** [June 4, 2024, 9:03am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/3 "2024-06-04T09:03:00Z")
Yes, the (rectangular) corners are ugly. I also use this technique for my self-destructing messages. I have a script to display the messages, in which I can specify the icon, the icon color, the message and the duration of the display via script parameters. There is a button on the card window that continues the script, so you can also click on the message to make it go away prematurely. ![Message](https://canada1.discourse-cdn.com/flex030/uploads/fmsoup/original/2X/5/59b178d61d368154822d8aaed65c351db2b6a11f.jpeg) I use these messages for notifications that do not necessarily need an interaction with the user, like "The PDF/Backup has been saved" or "The Record has been duplicated". ---
**Author:** ![vmenanno](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/vmenanno/32/1255_2.png) [@vmenanno](https://the.fmsoup.org/u/vmenanno)\ **Post date:** [June 4, 2024, 11:10am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/4 "2024-06-04T11:10:50Z")
Wy not just send OS notifications instead? ---
**Author:** ![cheesus](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/cheesus/32/182_2.png) [@cheesus](https://the.fmsoup.org/u/cheesus)\ **Post date:** [June 4, 2024, 11:23am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/5 "2024-06-04T11:23:28Z")
Yes, that would be an option too. But I don't like them very much. I like to have my messages within my software where I have full control. ---
**Author:** ![weetbicks](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/weetbicks/32/206_2.png) [@weetbicks](https://the.fmsoup.org/u/weetbicks)\ **Post date:** [June 5, 2024, 12:48am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/6 "2024-06-05T00:48:26Z")
Can't put a chart in an OS notification 🙂 ---
**Author:** ![weetbicks](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/weetbicks/32/206_2.png) [@weetbicks](https://the.fmsoup.org/u/weetbicks)\ **Post date:** [June 5, 2024, 12:55am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/7 "2024-06-05T00:55:03Z")
Awesome work, very effective, though that tiny visual imperfection where the background colour doesn't match is something I find hard to get past ! This is where a simple change to the product would be great, an option for roundedness of a card window corner 🙂 I was wondering if this kind of thing were technically possible without a product change, as I enjoy these kinds of ponderings... Given your parent window, the size of the card, and it's positioning, it is possible to attain the 4 coordinates of the card corners, from the perspective of the parent window. Knowing these coordinates, the next step would be to poll somehow for the screen colour at these coordinates, I'm thinking MBS must surely have some function capable of this... Assuming you can attain those colours, each corner of the card could be a web viewer, with the rounded SVG within, however the outer part might just be a background fill colour of the web viewer page, which could be set to the corresponding coordinates colour. Thus each corner can represent a different background colour, giving the appearance of it having true roundedness... Now, I welcome someone taking on the challenge and producing a sample file 🙂 ---
**Author:** ![Malcolm](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/malcolm/32/196_2.png) [@Malcolm](https://the.fmsoup.org/u/Malcolm)\ **Post date:** [June 5, 2024, 2:11am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/8 "2024-06-05T02:11:33Z")
We don't really want to use four web viewers for this job do we? Sliced background image does the same job. ![image](https://canada1.discourse-cdn.com/flex030/uploads/fmsoup/original/2X/f/f8a4bce1d600442f7f6c8110fc717f88b8edf86a.png) ---
**Author:** ![weetbicks](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/weetbicks/32/206_2.png) [@weetbicks](https://the.fmsoup.org/u/weetbicks)\ **Post date:** [June 5, 2024, 8:10pm UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/9 "2024-06-05T20:10:18Z")
Another good solution, but the point I was trying to make was that the dark grey area of the image slice is still the same colour on all 4 corners. I was pondering how one might avoid the below artefact where the background colour of the parent layout is something other than white. A web viewer would at least allow you to programatically specify a background fill colour for the grey section - providing you actually can determine what that colour should be. At the end of the day it's just an interesting but somewhat over-engineered exercise on my part, just thought it was interesting 🙂 The original solution is more than fine and you really don't notice it. ![Screenshot 2024-06-06 at 8.08.44 AM](https://canada1.discourse-cdn.com/flex030/uploads/fmsoup/original/2X/4/4e8efe767666b4bf094318b43022a7a219850555.png) ---
**Author:** ![Malcolm](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/malcolm/32/196_2.png) [@Malcolm](https://the.fmsoup.org/u/Malcolm)\ **Post date:** [June 6, 2024, 7:54am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/10 "2024-06-06T07:54:07Z")
I can see how you could lose a morning figuring out how to do this 😄 It would be nice to specify a radius for corners when calling a new window. That would solve the problem completely. Another wish: SVG as layout objects. With the ability to define them on the fly so that they could be tweaked to best fit. ---
**Author:** ![jwilling](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/jwilling/32/256_2.png) [@jwilling](https://the.fmsoup.org/u/jwilling)\ **Post date:** [June 6, 2024, 8:46pm UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/11 "2024-06-06T20:46:52Z")
Grr, this is just making me realize how bad I want actual rounded corners on cards. ---
**Author:** ![Raskolnikov](https://avatars.discourse-cdn.com/v4/letter/r/ac8455/32.png) [@Raskolnikov](https://the.fmsoup.org/u/Raskolnikov)\ **Post date:** [June 10, 2024, 10:02am UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/12 "2024-06-10T10:02:21Z")
Why not just put a rectangle with rounded corners on the background? I think it's a bit overkill to cover the corners with four separate SVG images. 🙂 [invoice paid](https://payrollplus.ch/img/invoice_paid.png) [invoice created](https://payrollplus.ch/img/invoice_created.png) ---
**Author:** ![planteg](https://yyz2.discourse-cdn.com/flex030/user_avatar/the.fmsoup.org/planteg/32/627_2.png) [@planteg](https://the.fmsoup.org/u/planteg)\ **Post date:** [June 10, 2024, 10:31pm UTC](https://the.fmsoup.org/t/rounded-card-corners-hack/4139/13 "2024-06-10T22:31:15Z")
@Raskolnikov , welcome to The Soup !