---
title: Tyylit 1001site-luettelosta
description: Kuinka valita tyyli 1 000 esimerkkisivustosta, käyttää sitä sivustollasi, muuttaa sitä tai poistaa se. Tyylitiedostot tekoälylle.
section: design
keywords: Verkkosivuston tyyli, tyyliluettelo, design, teema, värit, fontit, DESIGN.md
updated: 2026-09-16
howto: yes
---

Tyyli on ennalta suunniteltu verkkosivustomalli, joka perustuu tunnettuun alustaan: värit, fontit, painikkeiden ja korttien muodot sekä animaatiot. 1001site-luettelo sisältää 1 000 tyyliä. Valitse malli, napsauta "Käytä", ja verkkosivustosi suunnitellaan kyseisellä tyylillä.

> [!tip] Kenelle tämä sopii?
> Kaikille, jotka haluavat kauniin verkkosivuston ilman suunnittelijaa. Voit muuttaa tyyliä niin monta kertaa kuin haluat.

![Tyylin valitseminen toimistollesi](/wiki/img/style-picker.webp "“Valitse tyyli luettelosta” -ikkuna: haku, videokortit, “Käytä”-painike")

## Mistä valita tyyli

- Tililläsi: Asetukset → Etusivu ja valikko → "Sivuston tyyli" → "Valitse tyyli" (tai "Valitse toinen"). Tai noudata [oppaan](/wiki/fi/guide) vaihetta 2.
- Hakemistosivustolla [1001site.com](https://1001site.com/): avaa tyyli ja napsauta kortin alareunassa olevaa "Käytä tauluun". Jos olet jo kirjautunut sisään, tyyli otetaan käyttöön välittömästi.
- Valitse rekisteröitymisen yhteydessä luettelosta "Hanki se" → "Kaikki sisältyy". Tyyli muistetaan ja otetaan käyttöön maksun jälkeen.

## Askeleet

### Vaihe 1. Avaa luettelo

Napsauta "Sivuston tyyli" -osiossa "Valitse tyyli". Kortteja sisältävä ikkuna avautuu. Vie hiiri kortin päälle nähdäksesi videon esimerkkisivustosta.

### Vaihe 2. Löydä tyyli

Haku hakee tuotemerkin, värin, fontin ja luokan mukaan. Esimerkiksi: "omena", "minimalistinen", "tumma", "kauppa".

### Vaihe 3. Napsauta Käytä

Muutamassa sekunnissa tyyli otetaan käyttöön: värit, fontit, pyöristys, varjot ja animaatiot. Valitun tyylin nimi ja esikatselu näkyvät "Sivuston tyyli" -osiossa. Avaa sivusto napsauttamalla "Katso tulos" -linkkiä.

## Mikä muuttaa tyyliä

| Mitä | Miten |
|---|---|
| Värit | Tausta, kortit, teksti, korostus. Oletusarvoinen vaalea tai tumma teema – kuten esimerkissä. |
| Fontit | Esimerkkifontin kaltainen fontti on valittu Google Fontsista |
| Lomake | Nappien ja korttien pyöristäminen, litteät kortit tai varjostetut kortit, tiheys |
| Animaatiot | Yksi neljästä sarjasta: rauhallinen, pehmeä, hehkuva, dynaaminen |
| Kotiin | Jos "suunnittelukotisivu" -kytkin on käytössä, yläreunaan lisätään pääelementti, jossa on sivuston nimi ja tyylin iskulause. |

Tyyli ei vaikuta tekstiisi, tuotteisiisi, kategorioihisi, sivuihisi tai CSS:ään. CSS-muokkauksesi tallennetaan tyylilohkon viereen.

## Tyyli ja tekoälyavustaja

Tyylin valinnan jälkeen tekoälyassistentti kokoaa kotisivun ja sivut kyseisen tyylin suunnitteluohjeiden perusteella: sommittelu, kuvasto, typografia ja tekstin sävy. Tämä on sama periaate kuin suunnittelijoilla: tyyli → suunnittelujärjestelmä → sivut.

## Muuta tai poista tyyli

- **Muuta**: "Valitse muu" → valitse uusi → "Käytä". Edellinen tyylilohko korvataan, sitä ei lisätä.
- **Poista**: roskakorikuvake tyylin esikatselusta. Tämä poistaa tyylin CSS:n ja nimen. Värit ja fontit pysyvät ennallaan – voit säätää niitä brändäyksessä tai pyytää avustajaa "nollaamaan ulkoasun".

## Tyylitiedostot

Jokaisella luettelon tyylillä on tiedostoja, jotka tekoälytyökalut ymmärtävät:

- **DESIGN.md** (täydellinen ja kompakti) — tyylin kuvaus: värit rooleineen, fontit, koot, sisennykset, tee-/älä-säännöt.
- **Tailwind v4** on Tailwindin teema.
- **CSS-muuttujat** - CSS-muuttujat.
- **Design Tokenit** — JSON tokeneilla.

Tiedostoja voi kopioida tai ladata tyylin luettelosivulta. Ne on helppo antaa Claudelle, ChatGPT:lle, Cursorille tai avustajallemme: "Tee se tällä tyylillä." Katso [tyyliluettelo](/wiki/fi/reference-catalog).

## Tariffit

Tyylin lisääminen verkkosivustollesi on saatavilla maksullisilla paketeilla. Ilman pakettia tyyli tallennetaan ja otetaan käyttöön automaattisesti maksun jälkeen.

## Kysymyksiä ja vastauksia

### Tyyliä käytettiin, mutta sivusto ei näytä esimerkin kaltaiselta. Miksi?

Tyyliin kuuluvat värit, fontit, muodot ja animaatiot. Sivun rakenne ja valokuvat ovat sinun. Jotta kotisivu näyttäisi esimerkin mukaiselta, kysy tekoälyassistentilta: "Suunnittele kotisivu sivuston tyyliin: sankari, edut, galleria, yhteystiedot."

### Voinko käyttää tyyliä useilla sivustoilla?

Kyllä, tyyliä käytetään nykyisellä sivustolla. Vaihda sivustoa kojelaudassa ja käytä tyyliä uudelleen.

### Muutin värin manuaalisesti ja käytin sitten tyyliä. Kumpi voittaa?

Tyyli. Tyylin värit korvaavat manuaalisesti valitut värit. "Koodi ja widgetit" -osiosta muokattu CSS säilyy.

### Mistä esimerkit tulevat?

Avoimesta luettelosta suosittuja verkkosivustotyylejä. Videot ja julisteet tallennetaan palvelimellemme.