Subscribe
Sign in
Tylify — Create seamless patterns in seconds
Tylify is a seamless pattern maker that's available as a Figma plugin and a standalone web app.
Pattern elements can be vector or raster images. Export formats include SVG, PNG and CSS with embedded base64 SVG.
70
Replies
Best
Dan Robins
Niiiiice! I hate making patterns, and as a designer they are such a handy asset. I'm looking forward to having a play around!
Report
Share
(also love the Halloween theme... just shows how quickly you can spin up some seasonal patterns)
@dan_robins Thanks, Dan! I used to dread making patterns too, that's why I made Tylify. Thanks for checking it out :)
I'm curious, as a designer are you more excited about the standalone app or the Figma plugin?
@dan_robins In the standalone app, if you press the "Download" button it shows you previews of your pattern on a blanket, pillow and mug. Given the upcoming festive season, I think adding wrapping paper would be worthwhile!
Thanks for sharing your thoughts and ideas, Dan!
@webdevluca For me, the Figma plugin represents the most convenience - it's less likely I'll download an app specifically for one thing if I can use a plugin. That's just my personal use case though - I'm a product designer, and so I have access to Figma. You may find that there is a 'non designer' or 'print designer' audience that would just like to use the app, who may not have access / want to use Figma.
The app does look really nice though! Nice work Luca!
It's awesome. I have spent a lot of time in the past doing seamless patterns. This would have been a huge time saver. I will definitely use it in the future. The best of it all is that it accepts SVG and export in SVG.
Just one thing I found a bit confusing was changing the background colour. Great work mate.
@jsteneros Thanks, Johan! You and me, both. I used to dread seamless patterns so much because making them was such a tedious process!
First-class SVG support was a priority for this project. Export as an SVG and display the pattern with pixel-perfect quality at any size 😎
Thanks for the feedback about changing the background color. The approach is a indeed a bit different from popular tools like Canva. I'll reconsider the way it's done and see if I can make it more intuitive.
What a great experience! I accidentally clicked into the tool when first looking at this profile and was immediately presented with the ability to play around with a randomly generated pattern, which was super easy to manipulate on mobile! 👌
@n_russell I'm so glad you found it easy to jump right it :) Thank you for the kind words, Nick!
I'm an entrepreneur and designer and often times need a seamless pattern but just avoid it because it don't want to go through all the trouble in Illustrator. This is super simple to use and would work in just about any situation. You mentioned Figma, so I'll just say I'm way more excited about the stand-alone website as I don't use Figma.
@heydustinlee Hi, Dustin! I'm glad to hear that Tylify will be of use to you. The standalone app is convenient because it's always just a new tab away. However, there a few things the standalone doesn't do as well as the Figma plugin, namely:
Complex SVG exports - the plugin is able to leverage Figma's SVG engine
Resumability - there is currently no way to export a pattern as a "project" (think .psd and .ai) and resume work on it later. With the Figma plugin, the elements live in your Figma document so you are able to go back and edit the pattern whenever you like
If you ever run into these issues, you might want to give the Figma plugin a go. Thanks for checking Tylify out and sharing your thoughts. Your feedback is invaluable.
The use cases for this are endless! We used to print custom pattern notebooks for clients at a previous job of mine and the pattern creator we us we used for this was clunky as anything. Wish we had this more seamless experience back then for sure!
@n_russell "Seamless" experience, I 👀 what you did there! Thank you, Nick!
Tylify is a seamless pattern maker that's available as a Figma plugin and a standalone web app.
Tylify as a standalone application works well but combining it with Figma creates an even more powerful workflow for pattern creation. You are able to leverage Tylify's pattern-making capabilities while also benefitting from Figma features like drop-shadows, outlines and many others that are missing in Tylify because they fall outside the scope of the project.
How to use:
Launch the plugin to load a live pattern preview with your Figma selection. Reposition, resize, rotate and duplicate elements until you have a pattern you're pleased with. Press the Save button to load the seamless pattern back into Figma as an image with tile fill.
Creating a seamless pattern is a non-destructive operation. The source elements continue to live in your Figma document and manipulations done to the elements in Tylify will be applied to your Figma nodes.
Conversely, after a pattern is created you can make changes to the source elements in Figma by using the Toggle Tile Visibility option. Relaunch Tylify by pressing Edit to save and apply the changes to your pattern.
This keeps Tylify and Figma in sync and allows you to go back and forth between the two without any friction.
I'd love to hear your feedback.
This is super cool! But I can't find the terms and conditions info. Is it free for commercial use? or POD?
@maxrights Hi Madhan. Yes, commercial use (including POD) is allowed. More print-on-demand tools coming soon, stay tuned! :)
@webdevluca looks really handy! I was just on Figam this morning looking for plugins to create some nice background for product screenshots
@james_hoss Thanks, James! I'm afraid the plugin doesn't work in Figjam at the moment. I briefly investigated the matter and couldn't find a way to tile an image like you can in Figma.
@hitudrock Thanks Hitudrock. Have you tried refreshing the page? Every page load generates a brand new random pattern. Or do you feel that it's a poor user experience and a dedicated "Randomize" button would do a better job?
@webdevluca yes i tried. but scale and tile settings are reset at every refresh. I would also like to randomize only the emojis and the background color after editing the placements of the emojis.
@hitudrock Ok, I'll track this with a a feature request in the /r/tylify subreddit. It will most likely not have a UI element. Instead it will be a keyboard shortcut, built especially for you :)
