Practicable Measurable
Notetaking
Flotes is a free note taking app enhanced with flashcard features. Create, import, and share notes that can be practiced, measured, and leverage spaced repetition to maximize retention and efficiency.
Session
4
Easy
+2
Cloze Deletion
Accuracy
75%
+12%
How it works
Create, Study, Repeat
Users create and organize notes into Notebooks.
A Notebook is a collection of notes written in Markdown.
Notebooks will notify you the optimal time to study, and record stats based on your feedback and metrics.
Sharable
Invite friends to collaborate on a notebook together or share as read-only
Practicable
Practice sessions organize study into a measurable actionable activity
Statistics
Feedback from practice and other metrics are used to provide insight
Spacing
Optimizes session spacing for maximum challenge, retention, efficiency
Flotes Demo
My Notebooks
Shared Notebooks
Invites
Tailwind
Advanced Tailwind CSS
Optimal
Optimal
Notes
Writing Notes
Markdown Editor
Markdown is a common syntax for writing well-formatted notes. Import or export your notes, no data lock-in or proprietary format.
Features such as images, videos, tables, syntax highlighting, flow charts. Extended to create fill in the blanks for interactive study sessions.

# Tailwind Grid

### Grid Classes

Tailwind grid classes correlate to **css grid properties**. Match the *resulting css* to it's *tailwind class*.

`grid-auto-flow: column`

  • ?- grid-flow-col -?

`grid-auto-columns: max-content`

  • ?- auto-cols-max -?
### Example
```html
<div class="grid grid-flow-col auto-cols-max">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
</div>
```

Tailwind Grid

Grid Classes

Tailwind grid classes correlate to css grid properties. Match the resulting css to it's tailwind class.

grid-auto-flow: column

grid-auto-columns: max-content

Example
<div class="grid grid-flow-col auto-cols-max">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
</div>
Why Flotes
Get More Out of Studying
Retention
Flotes is structured to emphasize long term retention and efficiency.
Remember what you learn. No illusion of confidence.
Efficient
Builds statistics from your self-evaluation.
Figure out what works and what doesn't.
Archive what you know, practice what matters.
Effective
Create notes that are challenging and engaging.
Built-in spacing algorithm helps you practice optimally, without getting overwhelmed.

Tailwind Grid

Grid Classes

Tailwind grid classes correlate to css grid properties. Match the tailwind class to the resulting css.

grid-auto-flow: column

grid-auto-columns: max-content

Example
<div class="grid grid-flow-col auto-cols-max">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
</div>
1
1
Archive
Easy
Medium
Hard
Again
Start Learning Faster
"Flotes is the study app I wish I had in university"
— Software Engineer @ Cisco