Looking for Tech Site Builder alternatives?
Meet Quarkly.
Publish your website online or export it to Github. Use pre-made React components or build your own. Choose from one of many pre-made blocks
Create Project
Full control over the design.
Primitives
Primitive content components work like HTML tags. For example, Text, Image, and Вох.
Themes
Themes make it easy to create a consistent look for your website.
Extended Styling
With stylish animations, effects, and transformations, you can make your web page more exciting.
Adaptive design
Fine-tune your adaptive design
Components
Create a component from one or more objects on the page or from the Layer panel. Add copies of the component to the page, and they will inherit all the props.
Ready-made Content
Add maps, videos, pop-ups, and more to your site with ready-made blocks.
Customizing design with breakpoints
Check out your 100% adaptive website by using different design solutions for elements and breakpoints.
Adding and editing breakpoints
You can customize the breakpoints in your project theme by adding or editing them.
Drag'n'Drop
Move elements around, place them however you want on the page, or nest them in other elements.
Multiselect
You can apply styles to multiple elements at once and move them around, as well as remove them.
Text editor
You can edit part of the text making it bold or italic, turning it into a link or converting to span, as well as appyling any style to it.
Deep select
Double-clicking the hierarchy of elements will take you up and down the element structure. If you want to get inside the structure, hold down the Ctrl key on Windows or the Cmd key 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 appearance of an element, for example, its hover behavior, enable the "hover" prop and apply any desired additional props.
Google Fonts Connection
If you want your site design to look more professional, consider using a library of more than 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
This section allows you to configure the display properties of elements.
Typography
In this section, you can change text styles using special properties
Indents
You can configure margins and paddings in these settings.
Background
This section consists of props for element backgrounds.
Borders
This section allows you to configure borders and border radius.
Position
This category allows you to position elements and set their z-index values.
Transition
This property makes an element transition smoothly from one state to another.
Transform
You can transform the element using this property, for instance, rotate or zoom.
Development capabilities.
Supercharged.
Create custom React components using the code editor.
With the Quarkly code editor, you can create unique React components and then place them on the page.
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
If your goal is to host a project on your server, here's the one thing you have to do: export it into an archive with a create-react-app project!
Code Editor
Fine-tune elements in the code editor
Export to Gatsby Project
You can easily export your projects to Gatsby, a popular static site generator.
Pushing commits to your GitHub repository
You can store your project in a GitHub repository and make changes to it.
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
The editor displays all the entities of the page.
Debugger
Use our debug console to track errors in the component code and pages.
Code hints
If you are not sure how to spell a property, start typing and the editor will help you.
Synched pages and code editor
Whatever changes you make to the pages, they all will be displayed in the code and vice versa.
Stunning opportunities for business.
Collaboration
Quickly invite teammates to work on your projects in Quarkly.
Semantic tags
Every component can act as a tag. Just choose the “as” property value that you need.
Schema.org
In the code editor, you can add attributes to elements as necessary.
Image ALT
This is a separate property of the “Image” element.
Favicons
Set up exclusive icons for various 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
To improve your site's SEO, make sure the URLs are readable by humans.
Robots.txt and sitemap.xml
These files are created automatically for you to edit further.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project