Expert advice required for design

Hello all,

I need some expert advice for a particular design type that I found on internet. I want to understand that is it possible to create this kind of design using Foundry 3 tools or do we need something else to create such design (image attached below)…

What I want to know is that how can we create these background black and blue Triangle shapes behind the column/card tool that have been created in this design. Are these triangles actually images that have been displayed behind the text using some kind of overlapping ?? If this is the case then have these been aligned this way so perfectly in one particular corner and how can we achieve this result ??

Thanks,
Ujjwal

You can try the overlap tool, i overlapped the image over the triangle. You can also create the image with the triangle in photoshop to make it easier.

1 Like

Thank you @stackJunkie. I will try this and see how it goes…

Thanks,
Ujjwal

I answered you over on the Blocs forum too.

Hi,

I have tried to create the design and this is what I have been able to achieve. Looks good to me for Medium breakpoint onwards to XXL, however for XS and S breakpoints, the image looks quite big. I have created a half size image for XS and S breakpoints (from 300x300 px to 150x150 px). Just that I am not able to understand how to use a different image in XS and S breakpoints.

Can you please advise !!

Thanks

Hello Mr. Fynn, as you see I have tried to implement the solution here by using two different stacks…

  1. 1 Column stack containing the Triangle image
  2. 2 Column stack containing the Image Slider and Paragraph

I put the 2 Column stack inside Overlap stack and adjusted the top and left of the Overlap stack to get the desired result, However the Triangle image on XS and S breakpoints looks wierd ( as you can see in the snapshot). I wanted to ask:

  1. How can we use different images based on breakpoints (eg: 150x150 px on XS and S breakpoints and 300x300 px Med breakpoint onwards)

  2. Is it possible to use multiple images stacked on top of each other inside one Image stack ?? If I am not wrong, it doesn’t seem possible. Image stack can only contain one image at a time.

Although a column can contain multiple images, but I am not able to position the two images to achieve desired effect. I have attached the sample .RW file for your perusal.

Thanks,
Ujjwal

Sample.zip (176.4 KB)

Sorry not near my mac.
If you placed the triangle in the image stack you should be able to control the max width of the image per breakpoint. There’s a drop down option for full width, normal, max width, etc. From there just enter the number that works to achieve the look you want.