Instructions for Customizing Your Template
Welcome to your new template! This template is built using the Relume Style Guide—the largest and most organized Webflow component library in the world. It’s designed to make your project easy to start and even easier to manage, thanks to the Client-first Webflow Style System created by the awesome folks at Finsweet.
What’s Inside?
This template comes with a clean, pre-built style guide. There are no unnecessary pages or layouts for you to delete—just the essentials to get you going. With a well-organized class system and responsive design, you’re all set to jump right in!
If you want to learn more about the Client-first Style System, check out Finsweet’s official guide here. It’s a game changer for keeping your Webflow projects clean, organized, and scalable.
Ready to Customize?
One of the best things about Webflow (and this template!) is that everything is fully customizable. Whether you want to tweak a style or overhaul the layout, you can make changes without touching a single line of code. Just dive into the Webflow Designer and start creating something unique that reflects your brand.
Need a bit of help getting started? You can check out Webflow’s Help Center for a bunch of guides on how to customize your new template.
Why We Use Relume
We’ve built this template using Relume because it’s a powerhouse of clean code and reusable components. Whether you’re a newbie or a seasoned designer, Relume makes it easy to keep your projects organized and efficient. And since this template follows the Client-first structure, you’ll never have to worry about disorganized styles or inconsistent layouts. It’s all about simplicity and ease.
Using SVG Code
This template uses SVG (Scalable Vector Graphics) for icons and images, which are ideal for responsive and high-quality designs. If you’d like to add or customize an SVG, here’s how:
- Getting SVG Code: Visit Phosphor Icons to find an icon. Once you’ve selected one, click on the SVG Raw button to copy the code for that SVG.
- Embedding in Webflow: To add the SVG to your Webflow project, use a Code Embed Block. Paste the copied SVG code directly into the block.
- Ensuring Dynamic Coloring: Make sure to put a fill="currentColor" in the path. This ensures the SVG will automatically match the surrounding text color, or you can dynamically change its color by adjusting the text color in Webflow.
Support & Resources
If you ever need a helping hand or run into any bumps along the way, you can always reach out to us at Docile Worm Studio. We’re happy to answer questions, give tips, or even help you make tweaks to your template. Learn more about our studio and what we do here.
Also, if you’re looking for additional templates or customization options, be sure to visit our site. We’ve got plenty of resources to help you grow your web presence and take your design game to the next level. Explore more at Docile Worm Studio.
Happy designing! :--)