RMv0YJlLOBe7cY7HgZ3Jox34R0Wrk7jLv3DZyBETA7I=

ZC8pa382rux3/Ya5JYmbaiFDJJqVQfa/ZkKRoDwNIOg=

zRYikcIlbF3Un7C26+4VGO/t8jKwNjjuAdQWLlZECTQ=

/zPeDB00QSmJg02UNPvvY6N+w7bL9XbOTmOZn0UHdA0=

9DmxyyZ8FEsc5DSKm/8DpcDu2e/GCLlCF0UJQCEBuSw=

JjJ1QQExEPT0oEkDXkJv3GS+SSK/inDh+qJb5poF7uc=

OU0WGPE+vsPHE35uwfF+0Jq1FmmrC0EZ1j07htBnxEM=

Pesmw2FSIduSR93sJEVAEAHyJZ4MQP9Pbn1gPgXxcXw=

l+2HpTI8qsEqSoxz6Y8y+po4C4+PakSbBdZ2Wp0L/Zk=

p8RKstqTUsFv0yM8P1EiWUksDkzfBxAw5OAvX/lo29w=

xdTyVT3ZuBSNWCl2NPxJ8eZ0ifhUzatwezSwUElWFy0=

I absolutely loved the style and interactions of this page on the Vercel site, so I had to take a crack at rebuilding it in Webflow.  There's so many great details, I tried to achieve as much as I could with native interactions and just a little bit of custom code.

✅ Native interactions
✅ 1 script to handle updating the bounding box widths around "Designers"

Feel free to clone and play around with it!

Actual site - https://vercel.com/design

Full design credit goes to the Vercel team. Just a fan testing my Webflow skills and trying to recreate their amazing work!

Vercel Design Page - Rebuild

Welcome to Finsweet Island.  Your first task is to find some food and get to camp, for tomorrow will bring new challenges.

Day 1 | Chris Abra

Day 3 submission for CloneComp

Had too much fun with day 2, so I had to go back to finish it off.  You now get to choose your final destination based on your vote criteria collected earlier in the site.

Thanks to all of the coordinators and sponsors for putting this awesome competition together!

day3-chrisabra

Saw a great tweet sharing an "x-ray" reveal style interaction from the Linear.app site and decided to attempt to remake it in Webflow.

✅ Native Interaction
✅ 2 quick lines of custom code (one for the stroked text, one for the CSS mask)

Feel free to clone and play around with it!

Original tweet - https://twitter.com/hybrid_alex/status/1576917187872317440

Actual site (scroll to bottom) - https://linear.app/integrations

Linear.app X-Ray Clone

Linear "X-Ray Reveal" Interaction