Backfield - Webflow Portfolio Template

Backfield is another minimal, sleek and smooth scrolled portfolio template for Webflow. It features a range of custom elements, such as smooth sliders, text animations and parallax image effects.

It's super easy to use and to display your work in a beautiful way.

Live preview

Read-only preview

The template has a total of 1 static pages:

• Home

1 collection template page:

• Projects

1 Collection

• Projects

3 administrative pages:

• Styles
• Instructions
• Licenses

2 minimally styled utility pages

• 404
• Password

The style guide lets you easily customize the style of the whole site, and the instructions page contains a few instructions on how you can customize more complex elements.

All custom code used for the template can be found in the site settings -> custom code tab as well as some page specific code in the home page -> custom code.

01 - Smooth scrolling

The smooth scrolling library used for this template is called Lenis. It's a fairly new smooth scrolling library that works perfectly together with native Webflow interactions.

If you don't like this effect, feel free to remove it by deleting the custom code from the body-tag in the site settings.

02 - Parallax image effects

The library used for all parallax image effects in this template is called Ukiyo.js. This effect affects all image elements with the class "Parallax".

This makes it super easy to apply the effect to new image elements by giving them the same class of "Parallax".

03 - Sliders

The Javascript library used for sliders in this template is called Splide.js. You'll find the initialization code in the homepage body-tag settings, and the setup code inside embeds for each project collection item on the homepage.

There are a lot of options you're able to modify in order to customize the sliders further. Read more about Splide.js on its documentation page.

04 - Word & Letter Animations

The word- and letter animations are created using a small Javascript package created by Waveshape called WordPlay. It's really simple to use, and you're able to find the initialization and setup code in the site settings body-tag code.

Details

After purchase, feel free to use it for what you want. We would kindly ask you (based on trust) to only use the template for one website per purchase.

Please note that Webflow project transfers are a manual process. This means that the template will be transferred to your submitted Webflow account as soon as possible, but may take up to 12-24 hours.

Thank you.