Love Letter #028 - Rebrand vid inspo, CSS letter toggle, new 4-column browsing

Your bigger screens are about to fill up... [Love Letter logo](=.oL62mLXsHu5rlpqF0Km2_herpe-Sk4IXbuizL5zso5I) [Love Letter](=.FIzMs7O8YUwZ1UmCw5ZLIYwRDmW6-7MDHbSiFy_IUuA) [#028](=.tL89ZNSJSfXtZZa5qqWVmLIUzT2HKd2sro5fUqVDZnU) This week I silently rolled out a [4-column layout](=.AfoSkJmPRwbnnzxAJzICxLXANiILuO9n4oO3RVzU4Wg) for anyone browsing the inspiration archives on 1600px+ screen. The thumbnail preview images are also 8.3% bigger and I dropped the masonry grid, so its a tad kinder on those skimming eyes. Still ironing out some kinks (yup, those arrows looks funky on Firefox!) but would love some feedback if you have a big screen :) Below are my favorite websites, UI components, templates, domains & finds featured on [One Page Love](=.UNAd9aw0dfcPmY_jxtpQZavYEiYVFWCQcNB-a0x28eg) since I last wrote. You can also read edition #028 [online](=.A50b_KxWn1xpPlLyJdzj8WZ_MiJb8B993CDyYZtvh8Q). Hope it keeps the inspo topped up! [Rob Hope](=.OxBZ4c1gtIBIUvMAAZ7q9OVIjwm1ha7TSe-kM9m3ss4) Much love, [Rob Hope] [Supported By](=.JItjecUHVh7MIsCA04FRh7ITkTgNGTTu5fOLV8a25p4) [Design in Figma, launch in Webflow](=.x4RubxKHyOVyaYpLmtD6Zfz0P2IiCfy3AR6rlKMHzEY) Big shout-out to website builder [Webflow](=.pnXRIXZiTqDY-bUXc3VmY_aA1_nnPCMVjJ7TnUVf6EM) for sponsoring this edition of the Love Letter. Convert your static designs in Figma to clean HTML and CSS in Webflow in just a few clicks with the [Figma to Webflow plugin](=.xzI3kKSWcS25SZSTUYnPXettWSAqSuNThkA3PW2WxdY). Design with auto layout in Figma, then easily translate your designs to Webflow as responsive flexbox structures — and adjust HTML tags within Figma to get your site live faster. [Install plugin](=.UD3fwA4c2lbfQK6THsd01_bwuJ1a83gMnTQc4ZvUCog) → [ Design in Figma, launch in Webflow](=.Ux9zFMknjSLfooV4eljsdKQ0M1qfeNr0dwJKXUID4MY) [Get Inspired](=.Oj_vZI5nqixqBOjTjmCCraw350uLYTqi4sGh_PF3f6I) [One Page website inspiration.](=.6XJ5To7zA9eYsKLu8PwPkQqnidtjWCrm7qKYW7_9shU) Get inspired with these unique Single Page websites ([full archive](=.nd-YkbmBSpd82J-Y5jVstkZSVEaEXiP9CKjXb9dXU_Y)) featured on One Page Love over the past week. [Six Eastern](=.28Ja4WAcpynu_AGCycSerENh4DseTUfr2jT3kD-pPfY) [Six Eastern](=.M_ll4hWdlbl85wPBBt0OrqNnQCXArW8MBcYSvQM2Urg) [Visit ➝](=.YiNr5tM_pF1819KGMsWy41W9v_EZ-k57re5yiMVDDpY) Lovely page load animation and elegant type throughout this unique horizontal-scrolling One Pager for Six Eastern who specialize in PR for startups. Nice touch adjusting their clock branding to match your current system clock. [Six Eastern](=.x0c0_cMwrlTmoBCycylsb70RM760q-pgHiYRwhbnqbs) [Six Eastern](=.k5X9CfAU7z9wqXk9D_qSn77vufMfe2y42EdlQL6RUCc) [Mouseback](=.GphdMUu_D6ZhRyemgbLWrJ2YilVgWJGSTsRL123GtTI) [Mouseback](=.Ux_tmmH_PUdQ1viHrIYKlvpoSeKcTTC3Cq-D2Ai8zPM) [Visit ➝](=.hNaBK4JLzhZ4p8h1CyQx6M6dXkOsAw9AedimqRNJD9Y) Clean One Pager taking waitlist signups for Mouseback, a SaaS to help collaborate on staging and ephemeral environments. [Dave Hawkins](=.S7tjQaK1xxbCwJyZI0SlNdkBldnVYaNFcFh4HijqTpc) [Dave Hawkins](=.j2Qw9VgRs8FfELAsUfdakVl3wXgYQWUaztu6gKn0D4Q) [Tech Konferencia 2023](=.FA3O2jzAKu2hMokPk_QCPfCkgVhYxPrG5G-bmvqxD0A) [Tech Konferencia 2023](=.K9oeORP7R9F7HOWb7_Zc2g_WoTIMAfNfAO7igI9B0VY) [Visit ➝](=.Lup8qu2MZdnxbv6wVv7fzmnjWJl51Dw6ZGbA0AhSAu0) One Pager (built with [Framer](=.BmYlw-aR0z4gAifKY0PuMtoqcq-1wpwZcv6y12dV6L8)) for Tech Konferencia 2023, a Slovak conference for machine manufacturers and operators. [Art4web](=.Q9kvPUJ5AO2yPtYBnJW-M0M4vK6nHGvYe_V87fpIALE) [Art4web](=.2Q8YGD_C0L9No8fI_HLc2oAvZE5FWPJ2xRDa516n6rA) [UG labs](=.plradRW-J0cm--E5biuHWXNWqueYfzg70fj9eU3-9vc) [UG labs](=.oXuVrM70rceW5RZNdzyVTgXyqbMLpf-nhZbgde8tm4k) [Visit ➝](=.BxHTIr3tIYipoCsQ5XqocyAr4kGDOy8B9lGJFdSj0Gw) Vibrant One Pager (built with [Webflow](=.r3sv3TbFiI3irtW76tKrkNLGJkW82nBL_s0Lftl4rkA)) for UG labs who aim to help child development using their conversational AI engine. Neat touch adding depth using floating blobs over the hero video and also having the kid ages among the parent testimonials. [Guts Agency](=.R_hSvYhF6rNcEvfbaYimndIhCc-jHWqKthK_ngKV2cY) [Guts Agency](=.TFqXXwSbU866ZYeRO1fjdKygQoxasWqm9pZyMT3-g4M) [Hi-Five](=.Gfw3drJkT_6kSt1rktZ6D5S2G1BfJAi9q9EIAomhvbg) [Hi-Five](=.9lCv0nuyKBhuAAnqwNjYo94dOYEikoDvGPOEI_5POUM) [Visit ➝](=.fqUEBl8OAThQkeCfO7iXzrYuhD5f_hxcJqCovIK9i1w) Neat One Pager (built with [Framer](=.AoxFpxxgZmGTJzf-qQ3xewCetRDEawVI8FTWbS01les)) for Hi-Five, a weekly newsletter by [Arcade Labs](=.vc8ITuu3owJW7Nrrd4iFp6WksIPW3KwEfYxQtV1661Q) curating design portfolios, startups, resources, and more. [Arcade Labs](=.tbqLZyxGYK2zqY19sexTOh10LMh3Yn8zsTRhcN0E4oc) [Arcade LabsPro](=.Aw7DIy-_uboARcZKOcSIYwy3LR0i9O5cI8nyiBWMAWc) [Cocoon](=.FyUZR7nKsv0Z5HsfIpdfY6jfsWc-tw-bYPwjmHelKas) [Cocoon](=.0VXUeHdQt1iC8K7JpKB2Eox941JT2rV7xEdBI2MWWvk) [Visit ➝](=.FQVZ54JCbHwsJBuFAdbyMNYDam4c1arr9cy3rwLAliY) Impressive app walkthrough visuals as you scroll this One Pager (built with [Webflow](=.a-SfVkZfKizv7YLvr3MNaN7G1dcP56Hd8GajLbB0Y9U)) for Cocoon, a platform to help find the therapist that is right for you. [Marjoe Bacus](=.Jh5y9-WTw1npL_0Q_TFL1GPA8pb7oaLd5XAAwEk4Rp8) [Marjoe BacusPro](=.8zc0TqK2O-sYROAyybqhZ0OZ_hZf-nnT4FFEo4eIkCM) [Noteworthy](=.wpN6SCa_xqkAeUtxb3fGGPvu5jKlzI6lv3tnE_ghllM) [Interesting UI components.](=.vaaUbmT8XNahVEKS3dQWsVSr4aq0NMsrWofWjve_l9Q) Some recent page components ([full archive](=.xPLNp1dYHO6Cbqkj7pC3wtQeOlRxLj1Io530xqj9f2g)) I thought were really well designed or found interesting. Each is captured in full HD and links to the original page source. Hit me up if you scroll into something fresh. [Kukla 3D Illustrations](=.AzDUciq4b3w7-YqQL61Sb46bcRkrGM9I4p_h5Ll84Ww) [Kukla 3D Illustrations Demo](=.tRpUnswJD3sI5ywiHr9QlFEJ6AKwutT0q3F36kKHsmQ) [Visit ➝](=.W0MNlhELna7J5xXIdUAqsofOVhAegLFLSmm8hwn3ViI) Kukla kit is a pack of 3D elements for Figma. The Landing Page featured (recently redesigned) these fun interactive hotspots that change the product demo colors. Designers are channels. They are tapped into frequencies more than others and are able to read these energies and bring them into the world. That’s why sometimes they have no clue why they think something works or looks cool - it came through them not from them. [Quoter](=.XHQc5GhFW7SRwcF-ABQYCcdD_c68sS-WAicgj-PrGR4) [@hemeon](=.OW_dwVt8jF421o9Av5GAuDVH4MsyqdbsGx5AHI3ixTU) [Validate Faster](=.erML5sfmtCgd_r4A6FI7VjjPeE3HzeuN30uASnxETdE) [Landing Page Templates.](=.MYMX_dBWAXoBPelKRKNMeMpYwYToG4cPLN37K04htN8) Long-scrolling Landing Page templates ([full archive](=.1DGqXNW-84ehcM5xQuGCl8G43rrSd925i4G4ghq6V9U)) to kickstart and validate your next idea quicker. [Cinesnap](=.54IJ4qcougmMGTjS6YCQ8HiyOcbb2aWofGcBccTA6b4) [Cinesnap Framer Template](=.f68KX_a2Tq1AgXLnToyOBV4B9xFFp6KksOrZy_KoyQg) [Demo](=.RhaXBAcFaFOrUATPpuQ-Ar88PSc1hgf-GpxyDHyMJDk) [Clone $29](=.JD5if39tGnAaSLb3A_8u8MHVGPji0o-OJLTnzcTPqLA) 'Cinesnap' is a gleaming App Landing Page template built for [Framer](=.Ktr1tgwNk36C_bg_neia2tegO2s5Yss9NBKvbGYdXgU) by [Gizem Onan](=.3yFLnhg6XCQduxrNfS-fpFWKitAQlRul4_KUsfRpLsU). As you scroll the elements animate and the components come to life. The long-scrolling design featuring parallax effects, device previews, scrolling awards, a testimonial slider, pricing table and FAQs. [Appvilla](=.JbTNUMxNAdFf1sxlPipfsFAsgN7AR7QOL5_4QmaZTXY) [Appvilla Bootstrap Template](=.Bgk2SFAfzXmKCY99f-RNp0zSvbsp06au1-b_eWDgitA) [Demo](=.nnFNGzZvI3S4SlgaRvJBuKE9ZOkAkiaEpVfZKZIt90E) [Download Free](=.a8sdjf_5bclG-AJD3dhbyO7YbVyImae_USr55kAxxnM) 'Appvilla' is a free template by [UIdeck](=.T7QcTWqK-p-k-dQctb-LHi2w-eIWLFfDAksfwPn0p0o) crafted for a mobile or web app Landing Page. Please note this is the free version (must keep credit, no commercial license, reduced page sections) of a [premium version](=.PJumgjJOEq_VFUrQz3PKs-1QSEm69FYkEojZ1Mfgov4) and you will need to give your email address to UIdeck upon checkout to access the freebie. [AI Tool](=.JjqyDVMoEVdnbkP24lhsZihJXo88Neg0Hf3SFEXUDmQ) [AI Tool Tailwind CSS Template](=.uK6jjvaQKSHCP0SOGFpfXKDvXnrDt3L3hGhlN3df5WM) [Demo](=.OxFbaM37tKJ3i3rVlDlCCWRcfwfAetEq9YFa26nuDEA) [Buy $19](=.QKatmJDiMCYt72YGOwY0rATJGnbh9DcTvTqz4C_DYiw) 'AI Tool' is a modern Tailwind CSS Landing Page template crafted by [UIdeck](=.uhi69KkJgPnW9vn4rK0-mTuVtj5S5jIArGzBbtXdEKo) for AI-driven tools, startups, software and apps. [CSS Fun](=.FOWzON8gTd9OFl_aUNRvQ3vh8T1MbwbNK8zaXyE7Jhc) [Merging Letter Toggle by Jon Kantner](=.yeGcIKoXqYZJNeujnT8J9u-XEnKVOU3hTgsXJGiuVKY) [ Merging Letter Toggle by Jon Kantner](=.lWBDRhSAnG6HX0R9wHto2L_VHQnWlUIFIqClklo0CKw) [Available to register](=.hlgaLA4H6Eu5V9iLrA48WPHc2nSGtTv01VjkZYs7VvY) [Brandable dot com domains.](=.gypWmWTS1I0qd38F6RaxH-o3zd4lelGKbwLPdqvjqk4) Give your side project a better first impression with these memorable dot com domains ([full archive](=.k0KAPb8AwF4FTtXUjBeGFHDwKO9kBMVBpuFCEi33M4M)) I handpicked recently. They are all available to register right now. Yup! First come, first serve. • [Muloa.com](=.nuPsa0_yJ3rk7Je3jxWxUKF5vi0gQUl5vdOENLPDjv0) • [Foxory.com](=.ogD4uLBQwnqdz_6G0Xv4AFmxPUMmX5xGZkps635VNMM) • [Amvaro.com](=.E45TSuxqJ6SfkrCe3s9vek8sg6ia2I48BgiUMOpxNkQ) • [Dashoy.com](=.fgQt3xlj4yeOnUaQjduboc_tvZRX9oMCmAetOfOSMw0) • [Kilri.com](=.D84Mit_yYQS53ccoD_94wqz1KWTx01tPmcfEwwpxFd8) • [Mellova.com](=.Sh-oq28MCJgvkKgS5G15yCsxJa5CqM_-csnwFBYuVXs) • [Pefsy.com](=.G0mo-HpubMaR16uZSEkrAoo_643WjpP8IiF1HhjSzSE) • [Ransia.com](=.OEOlcVqY22ub1ObJUm-Id5Ifxyvo-aDcrDbkbr087AE) • [Atlory.com](=.NO035SzBXN3C35eUjUYQ0FO_ii0H1O7bradhqTqgq98) • [Hesset.com](=.fNG5BVq5WWFfMldRHMipt67rKTJXrFApXVL-EfmQjwQ) [Featured Image](=.hk_ST3uMFKsoqNCEhuRDGGAQqXCLH0EcnicciHr7Iow) [Source](=.dLoCAzb-cQkrvDUudwaH632j-ToMx94QAI-Rm2u3Xmw) [Bonus](=.bqAeLN79oE9WRm4pdj-NALV9TPO5rye8-IYzlGIdVOs) [My favorite online finds.](=.m6EuaEcyioMEqEj5ElPlgAgYtk8itRweQcdm99WdMfA) A few resources for your next project but also some inspiring links to take a break with. Experienced anything special recently? Holla. [People and Blogs (launching 01 Sep)](=.rB839lBjii7YZ8EUGh3OTRersBVIg8GO2svYGHJH95c)[- My good Italian friend Manu is launching a brand new interview series (this Friday) that celebrates people expressing themselves through writing, in their own little corner of the Internet. Manu has been on a huge drive for meaningful human connection online so I know this series is going to be a hit and bring like-minded people together.](=.4Ra-DVhPGzEEzvDP5mXIgFSnnccMSwV5KB1pv0TNFVw) [Nav.Supply](=.B9Hrg23ngOy4s_gvD6yraLGnUMyOZ7HFD2tJr50qiR4)[- 10 fresh website navigation solutions to clone free to your Framer projects.](=.4lYSibx5z47GPuSbMdGSfgPiQo_MCeaV8iawCRFhhPc) [Rebrand](=.4-QXPS7F6q34xKMX4SXeFNp-OV1wqWusD1qDv0BP7oM)[- New inspiration gallery of big brand visual identity intros and rebrand video. It's still young but it's clean and fast.](=.F4GHNaNL0ZoX8EY8TMFtQpYoIkV6Ye7t76ZWFgZPIfA) [WordPress launch a 100yr plan for $38k](=.UClWCVoW7_zfs1bs7CpFu5qBM9ny3y0NMrrpCRddnb0)[- No, it's not April Fools. Took a minute to get my head around this. It's confident and will probably get WP.com a ton of press. Well played marketing team.](=.O5k91TSHRSBN7iBQ3xu7_-rhY7KTOydGdhU4NPPAXeI) [​Randoma11y](=.pF6bPcYwm4mWfGD8FWI_Bdu6HUafCiRbKO6x1b-gjN4)[- Neat tool to randomly generate fresh color palette combinations, that also pass accessibility ratings. The UX is great and you can blaze through dozens of random combinations, each stating the a11y rating. h/t aaronrolston.com daily newsletter.](=.VhhFpZKtN_hls4_uYPctCXPd5h0M-8t-IqmWiYv7y6s) [No Numbers Figma Plugin](=.URTTJDde4UYMgUlhv7bm46oox_ExF9AREzGiuQPyOWQ)[- Get rid of incremental numbers in layer names. Why keep Rectangle 123 if it's just a Rectangle? h/t @DenisJeliazkov](=.r7uSOnrJrJPl_W32pfvrFH3jzF7Lh-E00qHKwO0ClA4) [Break your rut with a small promise](=.xk7d19YhC5I6TVq6jwJeCfi8llLedyys-pgWzve-xeI)[- Little piece I wrote about how working solo online, the only way I can truly move the needle is if I’m held accountable.](=.AYYMqMPDxM5r3NJQUhVrasUzEvt-ags9hwEQ3cM9Xhk) [Landing Page Hot Tip](=.AC5h6Mntg1xck8WrwJ-84Ol8JWKtni2H7WRFfZO1aGo) [Boost confidence with payment method logos](=.oWhExRPSr-isRs_VxSC-8kx2F6sAoIY2BitJLou5M-s) Hot Tip #75 is to boost confidence with payment method logos. We’ve come a long way with online transaction confidence, but some demographics are more hesitant than others. An SSL certificate for your Landing Page is non-negotiable. You can further improve your visitor confidence by adding all accepted payment methods near your pricing tables, main CTA buttons, and Landing Page footer. All three are not too much. [Payment logos](=.myLfDjtv_2_LAdmnDGpAYWUX6OIGeUkiyKuDCcelYag) ps. here is a [brilliant free set](=.1I7sGKa2QPURkb2OJK3uic4NvD0D3gTYIqpwhZV-6PE) (pictured above) on IconFinder in PNG and SVG formats. [Your Curator](=.UtIEJXG8FheiH1byyQv8iB_ozoYlWvbEUQ9VxAN_ZlQ) [Hey! I'm Rob Hope.](=.XXrwG1avaF_mPrtzovRvfPj0_rt_oVZzelR00UuXs08) If you are enjoying [One Page Love](=.NLZw5wOgM3YarPB1acoW0d4BHykmocmucaTitThkYU8) and the Love Letter editorial here are a few ways to help support the work I do. [Rob Hope](=.OJ5K1GZQLRPUGfFWNBe8glMwFt13Kv-saxh4sUbdtK0) Spread the love about using: [onepagelove.com/letter](=.MiYC-L3kMu4V-nZl9JyslDQ-xo5KtGZSmMvDN9eTOPk) or forward this Love Letter #028 using: [this link](=.ZU3IDVmgIN6bgyiH8ZncxPHjGAulXEOchHnT-7UMehw). Grab my [Landing Page Hot Tips Ebook](=.9XV-4dzTOZD7jfnXbbw3f0Q5c6SAljvE1jQj-abBv0E) (here is 40% off) Follow [@robhope](=.v7A45IEW1ETg5CqeAn_EG891HBDemDshJIS1RlVxsUg) or [@onepagelove](=.kCIG-L6A5xXRpfx4XPIVXC0D3TM-8nBIFXcyMrP4U20) on Twitter Review the [Yo! Podcast](=.MwMdJliVHK4KdsYS0k_nZG1IA7Dj3uzhRIsUGGAbo20) on [Spotify](=.FaRo7j3JcOuj-To9FOmgPyGAE1BYDh8btHVUP1urRJw), [Google Podcasts](=.6yEGz3cO3y3h3kdQ-Cyc-X3K3mX-YRLqd1bnf5bsK_g) or [Apple Podcasts](=.rbjhaDZpOgvgqv2oJlgWieFfjcnB58u9FZ4CBM40CbM) Want to build a One Pager with no-code? [Get started free](=.R9a2ylhY7dC0yUI8cLrH8gF9CS6NTq72RV4oNEsj7j4) using [Webflow](=.h3dwOFIhyZDyNsVr6FSEPayckHF4-1ElMRVs6Pp4bS8) <3 [Unsubscribe](=.KdS9d1PgArdDZ3UkzU_LhMIFY71vnFYFJio7pRBTpqc) [Love Letter logo](=.aU5NjUdd-s2LhvCjRQeKpdtr0sp82Pqg_N2RJKXbPLE)