Skip to main content
Tema adalah palet warna bersama dan kelengkungan sudut untuk layar Anda. Setiap file memiliki tema dan tampilan (terang atau gelap), dan layar diberi gaya menggunakan token tema. Edit sebuah tema dan setiap layar yang menggunakannya ikut berubah, sehingga tim Anda bekerja dari satu set keputusan alih-alih menulis ulang warna di setiap prompt. Tema yang Anda buat atau hasilkan disimpan ke organisasi Anda dan tercantum di bawah Themes di Home, sehingga file apa pun dalam organisasi dapat menggunakannya.

Pilih tema untuk file

Pilih tema dan tampilan untuk layar baru dari penyusun prompt di dalam file. Tombol tema tidak tersedia di kotak prompt di Home.
1

Buka menu tema

Di penyusun prompt, klik tombol tema. Tombol ini menampilkan swatch tema saat ini, atau roda warna saat tema diatur ke Automatic. Menu ini berjudul Theme for new screens.
2

Pilih tema

Pilih Automatic, salah satu tema organisasi Anda (tercantum pertama), atau tema bawaan: Default, Blue, Grayscale, Green, Ice, Orange, Red, Rose, Violet, atau Yellow.
3

Pilih tampilan

Di bawah Appearance, pilih Light atau Dark, atau Automatic agar Flowstep memutuskan per layar berdasarkan prompt Anda. Misalnya, “a dark dashboard” akan menghasilkan tampilan gelap.
Pilihan Anda berlaku untuk layar yang Anda hasilkan berikutnya. Layar yang sudah ada di kanvas tetap mempertahankan tampilannya.

Biarkan Flowstep mendesain tema

Saat file belum memiliki tema, misalnya file baru dengan tema yang masih diatur ke Automatic, Flowstep mendesain tema kustom bersama layar pertama yang dihasilkannya. Anda akan melihat langkah Designing theme di chat selama proses berlangsung. Flowstep membangun tema dari:
  • Warna yang Anda sebutkan dalam prompt
  • Warna dalam panduan desain Anda
  • Warna merek dari lampiran dan tautan yang Anda tempel
  • Produk dan suasana yang dijelaskan prompt Anda, saat tidak ada informasi yang lebih spesifik
Tema mendapatkan nama singkat, palet lengkap untuk mode terang dan gelap, serta langkah pembulatan. Tema disimpan ke organisasi Anda di bawah Themes di Home, dan file menggunakannya untuk setiap layar yang dihasilkan setelah itu. Setelah file memiliki tema, Flowstep tidak akan mendesain tema lain dengan sendirinya. Untuk mendapatkan tema baru, pilih Automatic lagi di menu tema. Generasi berikutnya akan mendesain tema baru, dan file akan menggunakannya. Jika Flowstep tidak dapat mendesain tema, file akan menggunakan tema bawaan.
Sebutkan warna merek Anda di prompt pertama, atau atur di panduan desain sebelum Anda menghasilkan layar. Tema yang dihasilkan akan dimulai dari warna tersebut.

Ubah tema satu layar

Untuk mengubah gaya satu layar tanpa menyentuh sisa file:
  1. Pilih layar di kanvas.
  2. Di menu di atas layar, klik tombol Theme.
  3. Pilih salah satu tema organisasi Anda atau tema bawaan, atau beralih antara Light dan Dark.
Mengganti tema langsung memperbarui tampilan layar. Beralih antara Light dan Dark meminta AI untuk mengubah gaya layar, sama seperti edit AI. Menu ini tidak tersedia saat generasi sedang berjalan.

Edit tema

Buka tema dari bagian Themes di Home. Editor tema menampilkan pratinjau langsung tema, dengan Theme settings di sisi kanan. Gunakan tombol Light dan Dark di bagian atas untuk beralih pratinjau, dan klik nama tema untuk mengubahnya.
  • Colors: setiap grup warna memiliki swatch untuk terang dan satu untuk gelap: Primary, Secondary, Accent, Muted, Destructive, Background, Card, Popover, Border, Input, Ring, Charts, dan Sidebar. Klik swatch untuk mengedit warnanya, misalnya warna isian dan teks untuk sebuah grup, menggunakan color picker atau nilai hex.
  • Radius: pilih langkah pembulatan (Square, Slight, Balanced, Soft, atau Round), atau pilih Custom dan geser Base radius untuk menentukan sendiri.
Edit Anda disimpan sebagai draf, sehingga layar tidak berubah saat Anda bekerja. Saat Anda siap:
  • Klik Publish untuk memperbarui setiap layar yang menggunakan tema. Flowstep mengonfirmasi dengan “Published. Screens using this theme are updating.” (Tema dipublikasikan. Layar yang menggunakan tema ini sedang diperbarui.)
  • Klik Reset changes untuk membuang perubahan yang belum dipublikasikan. Layar yang menggunakan tema tidak terpengaruh.
Untuk menghapus tema, klik Delete theme di bagian bawah Theme settings, atau ikon tempat sampah di samping tema dalam daftar Themes di Home. Tema yang dihapus tidak lagi ditawarkan di menu tema, tetapi layar yang sudah menggunakannya tetap mempertahankan tampilannya, sehingga tidak ada yang berubah di kanvas Anda.
Semua anggota organisasi Anda kecuali Guest (tamu) dapat mengedit dan menghapus tema.

Tautkan warna dan sudut ke tema Anda

Warna dan sudut dapat mengarah ke token tema, bukan nilai tetap. Nilai yang ditautkan mengikuti tema layar. Saat tema berubah, misalnya ketika Anda beralih ke tema lain, mempublikasikan edit, atau beralih antara terang dan gelap, warna dan sudut yang ditautkan ikut diperbarui. Colors: di panel Fill atau Border, klik swatch warna. Di tab Token, cari atau pilih token dari grup Theme, Base, atau Tailwind. Gunakan tab Custom untuk warna yang tepat. Warna yang ditautkan menampilkan nama tokennya di panel, dan Anda tetap dapat menyesuaikan opasitasnya. Corners: di panel Corners, klik pratinjau sudut. Di tab Token, pilih satu langkah (misalnya md atau lg). Di tab Custom, ketik nilai yang tepat dalam piksel. Sudut yang ditautkan menampilkan nama tokennya, dan mengubah pembulatan tema akan membulatkan ulang sudut tersebut. Untuk mengubah nilai yang ditautkan kembali menjadi nilai tetap, klik Detach from token. Warna atau sudut tetap mempertahankan tampilannya saat ini, tetapi tidak lagi mengikuti tema.

Hal yang perlu diketahui

  • Layar mempertahankan tema sendiri: setiap layar mengingat tema dan tampilannya. Mengubah tema file hanya berlaku untuk layar yang Anda hasilkan berikutnya. Gunakan menu Theme per layar untuk mengubah gaya layar yang sudah ada.
  • Hanya versi yang dipublikasikan: layar menampilkan versi tema yang telah dipublikasikan. Draf hanya terlihat di editor tema hingga Anda mempublikasikannya.
  • Tautan token tetap bertahan setelah edit: warna tema yang digunakan di dalam bayangan, filter, dan gradien tetap tertaut ke tema saat Flowstep mengedit atau membuat ulang layar.
  • Langkah pembulatan yang tidak berskala: token sudut none dan full selalu berbentuk persegi dan bulat penuh, apa pun pembulatan tema.