Skip to content

hitesh113/TypeTheShit

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Typeगर - Typing Practice Web App

A beautiful, no-login typing practice application with advanced features and a unique design. Practice typing with multiple content types, modes, and visual styles. No data tracking, no data storage, just pure typing practice.

🎯 Key Features

No Login Required - Start typing immediately without any registration

🔒 No Tracking - Your data is never stored or tracked

Real-time Statistics - WPM, Accuracy, Keystrokes, Timer, Word Count

🎨 Beautiful UI - Modern, clean design with smooth animations

📱 Responsive Design - Works perfectly on desktop, tablet, and mobile

🌙 Dark/Light Mode - Toggle between two beautiful color schemes

📚 Content Types

Choose what to practice:

Type Description
Words Regular English words for standard typing practice
Numbers Numeric sequences to practice number typing
Punctuation Special characters and punctuation marks
Quotes Famous quotes for natural sentence practice
Mixed Combination of words, numbers, and punctuation

⏱️ Test Modes

Timed Mode

Test your speed and accuracy with time pressure:

  • 30s - Quick test for rapid feedback
  • 1min - Short test for consistent measurement
  • 3min - Standard test for endurance

Free Mode

Unlimited typing without time limits. Perfect for:

  • Building confidence before timed tests
  • Practicing specific content types
  • Continuous typing improvement
  • No pressure practice sessions

🎭 Typing Styles

Choose how characters are displayed for clearer feedback:

Style Description
Highlight Characters highlighted with colors and backgrounds (default)
Underline Characters underlined instead of highlighted - cleaner look
Fade Subtle fade effect with opacity changes - minimalist style

📊 Real-time Statistics

Stat Meaning
WPM Words Per Minute (typing speed)
ACC Accuracy percentage of correctly typed characters
TIME Time elapsed (countdown in timed mode, elapsed in free mode)
KEY Total keystrokes made
WORDS Total words typed correctly

🎯 How to Use

  1. Open the App - Open index.html in your web browser

  2. Select Options - Choose:

    • Content type (Words, Numbers, Punctuation, Quotes, or Mixed)
    • Test mode (Timed or Free)
    • Typing style (Highlight, Underline, or Fade)
  3. Choose Duration (if Timed):

    • Select 30s, 1min, or 3min
  4. Start Typing - Click in the text area or start typing to begin

  5. Real-time Feedback:

    • 🟢 Green = Correct characters
    • 🔴 Red = Incorrect characters
    • Light blue highlight = Current character position
    • Underline/Fade styles available in Style settings
  6. View Results - After test completes, see your final score

  7. Reset - Click Reset button to start a new test

🎨 Visual Design Features

Logo & Branding

  • Custom SVG Logo - Unique keyboard-inspired design
  • Gradient Colors - Purple, pink, and cyan theme
  • Typography - Clean, modern fonts with improved readability

Color Scheme

Dark Mode (Default)

  • Primary: Purple (#a78bfa) - Modern gradient
  • Secondary: Pink (#f472b6) - Vibrant and energetic
  • Accent: Cyan (#22d3ee) - Enhanced cyan
  • Background: Dark slate (#0f172a to #1a1a2e)

Light Mode

  • Primary: Light Purple (#d8b4fe)
  • Secondary: Light Pink (#fbcfe8)
  • Accent: Cyan (#06b6d4)
  • Background: Light slate (#f5f5f5 to #ffffff)

Enhanced Character Feedback

  • Correct Characters: Green text
  • Incorrect Characters: Red text with underline
  • Current Character: Gradient highlight with simple blinking animation
  • Upcoming Characters: Muted opacity for focus

Animations & Effects

  • Smooth character transitions
  • Gentle pulsing cursor effect
  • Progressive stat updates
  • Modal slide-up animation
  • Gradient text effects
  • Responsive hover states

🛡️ Privacy & Security

  • ✅ 100% client-side (no server)
  • ✅ No cookies tracking personal data
  • ✅ No data stored on servers
  • ✅ Optional theme preference in browser
  • ✅ Completely offline capable

🚀 What Makes Typeगर Different

Multiple Content Types - Words, numbers, punctuation, quotes, mixed

Free Typing Mode - Practice without time pressure

Typing Style Options - Choose how characters are displayed

No Login Needed - Pure typing practice without friction

Privacy First - Zero tracking, zero data collection

Unique Design - Different aesthetic from other typing apps

Single Page - Everything beautifully organized in one interface

Fast & Lightweight - No heavy backend dependencies

🌐 Browser Support

  • Chrome/Edge (Latest)
  • Firefox (Latest)
  • Safari (Latest)
  • Mobile Browsers

📁 File Structure

Typeगर/
├── index.html      # Main HTML file with all UI elements
├── styles.css      # Comprehensive styling and animations
├── script.js       # Typing logic, content generators, and functionality
└── README.md       # This documentation file

⌨️ Keyboard Shortcuts

  • Start - Click or start typing
  • Skip Word - Press Space (auto-advances)
  • Reset - Click Reset button
  • Theme - Click the 🌙/☀️ button to toggle theme
  • Mode Select - Use dropdown selectorsfor mode changes

💡 Tips for Better Typing

  1. Focus on accuracy first - Speed comes with practice
  2. Use proper finger positioning - Maintain correct posture
  3. Practice regularly - Consistent practice improves results
  4. Start with Words mode - Build confidence before mixed content
  5. Use Free mode first - Get comfortable before timed tests
  6. Progress gradually - Move from 30s → 1min → 3min tests
  7. Relax - Don't tense up, keep your hands relaxed
  8. Try different styles - Find the visual feedback you prefer

📈 Performance Improvements Over Time

Track your progress through multiple tests:

  • WPM typically increases with practice
  • Accuracy improves as muscle memory develops
  • Free typing helps build comfort
  • Different content types improve versatility

🎓 Practice Strategies

For Beginners

  1. Start with Words content type in Free mode
  2. Focus on accuracy over speed
  3. Practice for 5-10 minutes daily
  4. Try Highlight style for clear feedback
  5. Gradually move to Timed mode

For Intermediate Typists

  1. Mix content types (use Mixed mode)
  2. Practice timed tests (3 minutes)
  3. Aim for accuracy above 95%
  4. Challenge yourself with Punctuation mode
  5. Experiment with different typing styles

For Advanced Typists

  1. Use Quotes mode for natural text
  2. Take longer timed tests (3 minutes)
  3. Mix all content types
  4. Challenge yourself with exotic punctuation
  5. Track consistency across sessions

🔧 Customization

Feel free to modify:

  • Word pool - Edit WORD_POOL array in script.js
  • Quotes - Add/modify QUOTES array in script.js
  • Colors - Change CSS variables in :root section
  • Test durations - Modify button data-duration values
  • Typography - Adjust font sizes and styles in CSS

🎯 Future Enhancement Ideas

  • Sentence construction mode
  • Language support (other languages)
  • Sound effects (optional)
  • Statistics history (local)
  • Difficulty levels
  • Custom word lists
  • Typing tests from URLs

📝 License

This project is free to use and modify for personal use.


Master your typing with Typeगर!

Type fast, stay focused, practice consistently, and watch your typing skills soar.

No distractions. No tracking. Just pure typing.

About

A beautiful, no-login typing practice application with advanced features and a unique design.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors