Skip to content

English

All featuresDesign

Carry your identity through the project.

Preview how your current name, description, colors and fonts work together in a brand sheet and social announcement. Open Editor to change the identity or design behind them.

These previews follow your current Editor draft. Save and Restore use the same editor as the website. Brand downloads and sending email are outside this public preview.

Matching brand assets

Preview how your project name, words and design work together. These brand examples are read-only; creating or downloading assets is outside this public preview.

Loading font preview…

Project identity

Project site name: Field & Fold
Project description: Field notes and quiet practices for attention, reflection, and what follows when you return to the same place.

Browser tab example

Field & Fold

This example pairs your project’s name with the fixed Kottoko icon. Editing your project identity or design does not replace this website’s icon or wordmark.

Email examples

See transactional message examples that follow the project design. Viewing them does not configure a sender or send email.

View email examples

Supported outputs and limits

These examples show your browser draft. The separate local brand proof supports two fixed SVG files and a file describing their source. Downloads are not available in this public preview.

Local brand sheet proof: brand-sheet.svg · 1600 × 1000
Local social announcement proof: social-announcement.svg · 1200 × 630
Source information: kottoko-brand-assets.manifest.json

Local proof uses a verified installed design. Unsaved draft changes are excluded. Export is blocked by a design applied only to the local site, an invalid record for it or an installed design that does not match its project. This preview does not verify export files or authorize publication.

The SVG files reference the project fonts; they do not include the fonts. The local proof uses a project name of up to 80 characters and a description of up to 240; its fixed layouts can shorten longer text.

Icon, email, PNG, PDF and presentation exports are outside this public preview. There is no hosted asset generator here.

Build a website or app.With the core features included.

Kottoko is a starter project for websites and apps. It includes pages, user accounts, forms, and online store features you can customize instead of building from scratch.

Explore features

The shared foundation for your project.

Requires: Kottoko foundation

Publish

Requires: Accounts & access

Requires: Accounts & access

Grow

Requires: Accounts & access

Requires: Accounts & access

Requires: Analytics & insights

Requires: Accounts & access

Operate

Requires: Accounts & access

Requires: Accounts & access

Requires: Accounts & access

Sell + Connect

Requires: Accounts & access

Requires: Accounts & access

Requires: Commerce + Integrations

Requires: Commerce

Requires: Commerce

Requires: Accounts & access + Commerce

Kottoko foundation

See your changes as you make them.

Edit content, tune the design and choose features against the same website your visitors see.

KottokoWebsite editorInteractive example

Kottoko

Make Kottoko your own.

Change the heading and accent in this miniature page. It uses the same heading, field, and color controls as the website.

Page title

Accent colorAutomatic

Try it here. Changes stay inside this example.

What you can build

Explore starting points for websites, shops and member experiences.

Websites

Publish your ideas, work and resources.

KottokoBusiness websitesInteractive example
KottokoJournal
Introducing Kottoko
Publish Kottoko pages, product notes, and practical guides from one content workspace.
A home for your ideas.
Select a page to preview its heading and layout.
Try it here. Changes stay inside this example.
KottokoBlogs & publicationsInteractive example
KottokoJournal
Introducing Kottoko
Publish Kottoko pages, product notes, and practical guides from one content workspace.
A home for your ideas.
Select a page to preview its heading and layout.
Try it here. Changes stay inside this example.

KottokoPortfoliosInteractive example
Kottoko wordmark
Organize the visuals that make a Kottoko website recognizable. Select an asset, then inspect its name in Manage.
Try it here. Changes stay inside this example.
KottokoResource librariesInteractive example
Kottoko project files
Present project files and useful design resources in a member library. These example assets do not start a download.
Try it here. Changes stay inside this example.

KottokoLanding pagesInteractive example
Kottoko
Make Kottoko your own.
Change the heading and accent in this miniature page. It uses the same heading, field, and color controls as the website.
Page title
Accent colorAutomatic
Try it here. Changes stay inside this example.
KottokoMultilingual websitesInteractive example
KottokoEnglish
Build with Kottoko
Switch the example heading between English, Swedish, and Albanian. Keep each translation connected to the same page.
One website. More people.
Switch language without leaving the page.
Try it here. Changes stay inside this example.

KottokoImages & filesInteractive example
Kottoko wordmark
Organize the visuals that make a Kottoko website recognizable. Select an asset, then inspect its name in Manage.
Try it here. Changes stay inside this example.

Commerce

Sell products, downloads and subscriptions.

KottokoOnline shopsInteractive example
Kottoko Starter
See how a storefront presents a focused product range. These are example products, not items offered for sale.
Try it here. Changes stay inside this example.
KottokoProduct catalogsInteractive example
Kottoko Starter
See how a storefront presents a focused product range. These are example products, not items offered for sale.
Try it here. Changes stay inside this example.

KottokoDigital downloadsInteractive example
Kottoko project files
Present project files and useful design resources in a member library. These example assets do not start a download.
Try it here. Changes stay inside this example.
KottokoAffiliate programsInteractive example
Make recommendations traceable.
Explore an illustrative Kottoko partner referral. Attribution and commission records need a configured program; this preview creates neither.
01Prepare a partner link
02Preview the referred visit
03Inspect the referral record
Management preview
Make recommendations traceable.
Selected itemPrepare a partner linkNameShow this example
Explore an illustrative Kottoko partner referral. Attribution and commission records need a configured program; this preview creates neither.
Try it here. Changes stay inside this example.

KottokoPrint-on-demand shopsInteractive example
Kottoko canvas tote
Explore Kottoko merchandise concepts. Product setup and fulfillment require a connected provider; these examples are not for sale.
Try it here. Changes stay inside this example.
KottokoSubscriptions & billingInteractive example
Reader plan — example
Compare example membership plans and review a selection. They show a subscription flow in a project, not Kottoko pricing or plans.
Order preview
Choose an example membership plan.
Included access
Project resources
Payment
Not connected in this preview
Try it here. Changes stay inside this example.

KottokoCoupons & offersInteractive example
KottokoKOTTOKOExample offer
An offer with clear boundaries.
Apply an example offer to a Kottoko selection. A real offer needs its own eligibility, dates, and limits; no discount is promised here.
Try it here. Changes stay inside this example.

Members & apps

Create spaces for members and customers.

KottokoSaaS appsInteractive example
Kottoko
One account. A clearer overview.
Preview the resources a signed-in Kottoko member could access. This switch illustrates access; it does not create an account.
Profile and preferences
Project resources
Security settings
Member access required
Try it here. Changes stay inside this example.
KottokoMember websitesInteractive example
Kottoko
A place for your members.
Compare the visitor and member views of Kottoko resources. Try the access switch to see what membership reveals.
Project resources
Member updates
Account settings
Member access required
Try it here. Changes stay inside this example.

KottokoOnline coursesInteractive example
Learn by building.
Example workspace
Build your first page
A Kottoko learning path can guide members through a project. These example lessons show how learning content can be organized.
Try it here. Changes stay inside this example.
KottokoCommunity spacesInteractive example
Kottoko
Message preview
Keep the conversation together.
Preview a Kottoko project discussion and choose whether to receive its updates. No message is sent from this example.
01A question about page blocks
02A reply with a component example
03A note for the next iteration
NotificationsReceive project updates
Updates are on in this example.
Try it here. Changes stay inside this example.

KottokoCustomer portalsInteractive example
Your work, in one place.
Example workspace
Content drafts
A Kottoko workspace brings content, responses, and design controls together. Select a section to explore its example record.
Try it here. Changes stay inside this example.
KottokoMember directoriesInteractive example
Find the right collaborators.
Example workspace
Kottoko creators
Organize a Kottoko community around useful profiles and roles. These categories illustrate a directory without inventing real members.
Try it here. Changes stay inside this example.

KottokoDashboardsInteractive example
Your work, in one place.
Example workspace
Content drafts
A Kottoko workspace brings content, responses, and design controls together. Select a section to explore its example record.
Try it here. Changes stay inside this example.
KottokoAccounts & accessInteractive example
Kottoko
One account. A clearer overview.
Preview the resources a signed-in Kottoko member could access. This switch illustrates access; it does not create an account.
Profile and preferences
Project resources
Security settings
Member access required
Try it here. Changes stay inside this example.

Growth

Connect with your audience and understand what works.

KottokoNewslettersInteractive example
Kottoko
Message preview
What’s new at Kottoko.
Preview a product update with a clear reason to read it. The notification controls here are examples and do not subscribe you.
01A closer look at the editor
02New reusable page blocks
03Progress toward launch
NotificationsReceive project updates
Updates are on in this example.
Try it here. Changes stay inside this example.
KottokoForms & enquiriesInteractive example
Start with a useful question.
Try an enquiry for a Kottoko project. A clear field, inline validation, and a response view show the complete small interaction.
Project enquiries
Feedback on a page
Requests for help
Your message
Management preview
Start with a useful question.
Selected itemProject enquiriesNameShow this example
Try an enquiry for a Kottoko project. A clear field, inline validation, and a response view show the complete small interaction.
Try it here. Changes stay inside this example.

KottokoWaitlists & launchesInteractive example
Build interest before launch.
Try a Kottoko project-interest form and inspect its response. To join the real Kottoko mailing list, use Get updates in the website header.
Introduce the project
Collect an expression of interest
Review the response
Project name
Management preview
Build interest before launch.
Selected itemIntroduce the projectNameShow this example
Try a Kottoko project-interest form and inspect its response. To join the real Kottoko mailing list, use Get updates in the website header.
Try it here. Changes stay inside this example.
KottokoReferrals & invitationsInteractive example
An invitation with a clear next step.
Follow an example invitation to explore Kottoko. Preview the steps without sending an invitation or enrolling a real person.
01Prepare a Kottoko invitation
02Preview the join page
03Review the invitation status
Management preview
An invitation with a clear next step.
Selected itemPrepare a Kottoko invitationNameShow this example
Follow an example invitation to explore Kottoko. Preview the steps without sending an invitation or enrolling a real person.
Try it here. Changes stay inside this example.

KottokoRewards & achievementsInteractive example
Make progress visible.
Explore an example Kottoko onboarding achievement. Advance through a few meaningful steps and see completed steps stay visible.
01Explore a feature
02Customize a page
03Review your project
Management preview
Make progress visible.
Selected itemExplore a featureNameShow this example
Explore an example Kottoko onboarding achievement. Advance through a few meaningful steps and see completed steps stay visible.
Try it here. Changes stay inside this example.
KottokoAnalytics & insightsInteractive example
Illustrative data
See what people find useful.
Switch between illustrative measures for a Kottoko launch. These numbers demonstrate the interface and are not real traffic or subscribers.
Try it here. Changes stay inside this example.

Design

Shape the look and feel of your project.

KottokoWebsite editorInteractive example
Kottoko
Make Kottoko your own.
Change the heading and accent in this miniature page. It uses the same heading, field, and color controls as the website.
Page title
Accent colorAutomatic
Try it here. Changes stay inside this example.
KottokoComponents & blocksInteractive example
Kottoko
Small pieces. Real possibilities.
Explore a compact Kottoko page built with the product’s own components. Try the title field and accent control to see them work together.
Page title
Accent colorAutomatic
Try it here. Changes stay inside this example.

KottokoDesign patternsInteractive example
A familiar path from input to answer.
Try a Kottoko enquiry pattern: enter a message, see validation, then inspect the response. Nothing is sent or stored outside this example.
Clear field labels
Useful validation
A visible confirmation
Your message
Management preview
A familiar path from input to answer.
Selected itemClear field labelsNameShow this example
Try a Kottoko enquiry pattern: enter a message, see validation, then inspect the response. Nothing is sent or stored outside this example.
Try it here. Changes stay inside this example.
KottokoBrand & identityInteractive example
Kottoko
A recognizable Kottoko.
Aa Bb Cc0123456789
#101010#F5F5F5#EEF067
Page title
Accent colorAutomatic
Try it here. Changes stay inside this example.

Operations

Keep your project connected and running.

KottokoSearch & discoveryInteractive example
Find the useful part faster.
Example workspace
Search Kottoko examples
Kottoko editor guide
Search these Kottoko examples by name. A useful result connects people directly with the page, resource, or guide they need.
Try it here. Changes stay inside this example.
KottokoNotificationsInteractive example
Kottoko
Message preview
Know what needs your attention.
Preview Kottoko project notifications and try read states. Real notifications should link to a useful next action in the project.
01A content draft is ready to review
02A form has a new response
03An update is ready to inspect
NotificationsReceive project updates
Updates are on in this example.
Try it here. Changes stay inside this example.

KottokoIntegrations & automationInteractive example
Connect a useful next action.
Step through an example Kottoko form workflow. This visual rehearsal makes no provider calls and sends no messages.
01Inspect a form event
02Review its destination
03Preview the delivery result
Management preview
Connect a useful next action.
Selected itemInspect a form eventNameShow this example
Step through an example Kottoko form workflow. This visual rehearsal makes no provider calls and sends no messages.
Try it here. Changes stay inside this example.
KottokoUpdates & recoveryInteractive example
Improve with a way back.
Walk through a Kottoko update rehearsal. Review a change, preserve the previous version, and inspect recovery before applying a real update.
01Review the proposed changes
02Prepare a recovery point
03Inspect the recovery result
Management preview
Improve with a way back.
Selected itemReview the proposed changesNameShow this example
Walk through a Kottoko update rehearsal. Review a change, preserve the previous version, and inspect recovery before applying a real update.
Try it here. Changes stay inside this example.

Questions before you start.

Is Kottoko for websites or apps?

Both. Start with public pages, then use accounts, dashboards, forms, commerce, and other included features as your idea needs them.

Do I need to write code?

The editor lets you try supported content, design, and feature choices visually. Building custom behavior, connecting services, and deploying the project can require a developer or coding agent.

Are payments and email ready to use?

The payment integrations currently support test mode. These browser examples do not charge money or send transactional email. Live payment support still needs implementation and review; email delivery needs its own provider setup.

How do updates work?

Review how a change affects your project, prepare a backup, and check the result before release. Your hosting and setup determine the recovery steps.

Can I download Kottoko now?

Public downloads are not open yet. Explore the examples and documentation, or join the list below for launch updates.

Build your next project with a head start.

Get launch news, new examples, and product updates.

Confirm by email. Leave anytime. Read our privacy notice.