Looking for SITE123 alternatives?
Meet Quarkly.
Choose from one of many pre-made blocks. Visual interface, adaptive design settings, code editor, React components, all possibilities of CSS. Unlimited customisation possibilities, no-code tools of a classic editor
Create Project
Ultimate control over the design.
Primitives
The simplest, most basic components similar to HTML tags. For example, Text, Image, and Вох.
Themes
Build a professional-looking design using themes
Extended Styling
Now your website will be noticed! Use our unique animations, catchy layouts, and transformations.
Adaptive design
Fine-tune your adaptive design
Components
On the page or on the Layer panel, choose an element (or a group of elements) and convert them into a component. Add component copies to the page. All the props will be inherited.
Ready-made Content
Take advantage of the ready-made blocks such as maps, videos, pop-ups, and more
Customizing design with breakpoints
Rest assured your site is completely mobile-friendly by using different design solutions for elements at breakpoints.
Adding and editing breakpoints
You can use your own custom breakpoints, or select one of the existing ones.
Drag'n'Drop
You can move the elements wherever you want. Nest them in other elements, or leave them as they are.
Multiselect
You can select multiple elements and modify their styles or drag'n'drop them to change their location.
Text editor
You can change the appearance of text — for instance, making it bold or italic, turning it into a link, or converting it to a span—as well as apply any style to it.
Deep select
Click twice to go up and down the hierarchy of elements. If you need to get inside the hierarchy, hold down Ctrl on Windows or Cmd on MacOs.
Support of Flexbox and Grid
We're excited to offer you the best frontend coding practices around.
Configuring styles of pseudo-classes hover/active/focus, etc.
To change the way an element looks like, for example, how it appears on hover, just enable "hover" and configure the desired props.
Google Fonts Connection
Give your website a more vibrant look by using fonts from a library that contains over 990 font families.
Unsplash images
Browse Unsplash's collection of free images and choose directly from the Quarkly interface.
Props panel
Here you will find categorized style and functional properties.
Layout
Under this section, you can find element display properties.
Typography
In this section, you can change text styles using special properties
Indents
Here you can configure margins and paddings, which control the space around elements.
Background
In this section, you can find props for element backgrounds.
Borders
Here you can configure borders and border radius.
Position
This category helps you configure element position and z-index settings.
Transition
This property helps an element move smoothly from one state to another.
Transform
With this property, you can transform the element, for instance, rotate or zoom.
Development capabilities.
Supercharged.
Create custom React components using the code editor.
You can build and add custom React components to your Quarkly pages using the code editor.
React.js
The pages are written in JSX code typical for React.js
Hot import from NPM
Import modules to your component from NPM with ease.
SEO
Optimize your site to promote it on search engines
Export CRA
There is just one thing to do if you want to finish or host your project on your server: export it into an archive with a create-react-app project!
Code Editor
Fine-tune elements in the code editor
Export to Gatsby Project
Export your projects to Gatsby — one of the most famous static-site generation web frameworks
Pushing commits to your GitHub repository
You can create a GitHub repository for your project and commit changes.
Publication on Netlify
Once your site is ready, you can publish it on Netlify with a technical domain name such as https://inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
In the Quarkly editor, you can monitor all the entities that are present on the page.
Debugger
Mistakes in the component code can be identified in the debug console.
Tooltips in the code
If you have doubts about how to spell a property, start typing, and the editor will auto-complete what you're writing.
Synched pages and code editor
Whatever changes you make to the pages, they all will be displayed in the code and vice versa.
Great business opportunities.
Collaboration
Collaborate with your team on a project using Quarkly. Just send them an invite and get to work!
Semantic tags
You can make a component act as a tag by setting the “as” property to the desired value.
Schema.org
You can edit the necessary attributes of elements in the code editor.
Image ALT
This is a separate property of the “Image” element.
Favicons
This feature helps you install unique icons for all devices and individual tile background color for Windows 10.
Open graph and meta tags
Use these settings for the correct display of your site on social networks and in search engines.
User-friendly URL
This feature allows you to set friendly URLs for your pages.
Robots.txt and sitemap.xml
These files are automatically generated. You can edit these files to suit your needs for the future.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project