Landing page builder for startups.
Meet Quarkly.
Publish your website online or export it to Github. Visual interface, adaptive design settings, code editor, React components, all possibilities of CSS. Completely free — you should try it now
Create Project
Total control over the design.
Primitives
Basic elements that resemble HTML tags: Text, Image, Box, and others.
Themes
Using themes will help your website's design remain consistent.
Extended Styling
Give your website the edge it deserves with innovative layouts, engaging animations, and transforming effects.
Adaptive design
Fine-tune your adaptive design
Components
Transform an element or group of elements on the page or Layer panel into a component. Add copies to the page and they will inherit all properties.
Ready-made Content
Add ready-made blocks: maps, videos, pop-ups, and many more
Customizing design with breakpoints
You can make sure your site is mobile-friendly by designing different solutions for elements at breakpoints.
Adding and editing breakpoints
Use your own breakpoints or choose one of the ones that are already there.
Drag'n'Drop
The choice is yours on how to arrange elements on the page — nest them, move them, or drop them in the desired area.
Multiselect
You can select multiple elements to set their styles, drag'n'drop them to another place, remove, etc.
Text editor
You can turn a part of the text into italic or bold, make it a link or convert to span, and use any style for 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
At Quarkly, we use the most advanced frontend coding techniques.
Configuring styles of pseudo-classes hover/active/focus, etc.
By activating the "hover" prop and positioning the desired props, you can change how an element appears, for example in a hover state.
Google Fonts Connection
Add a personal touch to your website with the use of 990+ font families available in the library.
Unsplash images
Unsplash is a popular free image stock. You can search and select images directly from the Quarkly interface.
Props panel
Here you'll find categorized collections of style and functional properties.
Layout
This is where you can locate element display properties.
Typography
To change the style of your text, use special properties in this section.
Indents
Margin and padding configuration is available here.
Background
This section contains props that help you create element backgrounds.
Borders
In this section, you can adjust borders and border radius.
Position
The element position and z-index settings can be altered here.
Transition
This property makes it possible for elements to move smoothly from one state to another.
Transform
This property lets you transform the element, for example, zoom or rotate.
Development capabilities.
Supercharged.
Create custom React components using the code editor
Create your own React components in the Quarkly code editor and seamlessly integrate them into the page.
React.js
The pages are written in JSX code typical for React.js.
Hot import from NPM
Modules from NPM can be imported into your component.
SEO
Optimize your site to promote it on search engines.
Export CRA
You can finish or host your project on your server with ease by exporting it into an archive with create-react-app project.
Code Editor
Fine-tune elements in the code editor.
Export to Gatsby Project
One of the best open-source SSGs, Gatsby, may be used to export your projects in no time.
Pushing commits to your GitHub repository
You can store your project in a GitHub repository and make changes to it.
Publication on Netlify
Publish your website to Netlify once it is complete. Its technical domain name will be generated automatically.
Modern built-in code editor
The Quarkly editor lets you see all the entities that are present on the page.
Debugger
When there are errors in the component code or pages, they can be seen in the debug console.
Tooltips in the code
As you type, the editor will suggest possible matches to the property you're looking for.
Synched pages and code editor
All changes made to the pages are displayed in the code and vice versa.
Stunning opportunities for business.
Collaboration
Quickly invite teammates to work on your projects in Quarkly.
Semantic tags
You can use each component as a tag. Just choose the needed value of the “as” property.
Schema.org
In the code editor, you can give items the desired attributes.
Image ALT
A unique attribute that belongs to the "Image" element.
Favicons
This feature helps you to install unique icons for all devices.
Open graph and meta tags
Your site will display appropriately thanks to these settings on social media and search engines.
User-friendly URL
Get the best of both worlds with human-readable URLs that improve your site's SEO and usability.
Robots.txt and sitemap.xml
Ready-made files available for customization and future editing.
Landing page builder for startups.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project