Night Owl

# Night Owl Theme for Obsidian

A beautiful dark theme for [Obsidian](https://obsidian.md) based on Sarah Drasner's popular [Night Owl VSCode theme](https://github.com/sdras/night-owl-vscode-theme). This theme brings the elegant, eye-friendly color palette and syntax highlighting of Night Owl to your Obsidian workspace.

## 🌙 Theme Description

Night Owl is a carefully crafted dark theme designed to be easy on the eyes during those late-night coding and note-taking sessions. The theme features:

- **Deep blue backgrounds** that reduce eye strain
- **Vibrant syntax highlighting** with carefully chosen accent colors
- **Excellent contrast ratios** for improved readability
- **Consistent color palette** throughout the entire Obsidian interface
- **Professional appearance** suitable for both personal and work environments

The theme transforms Obsidian's interface with Night Owl's signature deep blue (`#011627`) background and complementary colors that make text pop while maintaining visual harmony.

## 📦 Installation

### Method 1: Community Theme Gallery (Recommended)

1. Open Obsidian Settings (`Ctrl/Cmd + ,`)
2. Navigate to **Appearance** → **Themes**
3. Click **Browse** to open the Community Themes gallery
4. Search for "Night Owl Theme"
5. Click **Install and use**

### Method 2: Manual Installation

1. Download the latest release from the [Releases page](../../releases)
2. Extract the files to your vault's themes folder:
   - **Windows**: `VaultFolder\.obsidian\themes\night-owl-theme\`
   - **macOS**: `VaultFolder/.obsidian/themes/night-owl-theme/`
   - **Linux**: `VaultFolder/.obsidian/themes/night-owl-theme/`
3. Restart Obsidian
4. Go to **Settings** → **Appearance** → **Themes**
5. Select "Night Owl Theme" from the dropdown

### Method 3: BRAT Plugin (Beta Testing)

If you have the BRAT plugin installed:

1. Open BRAT settings
2. Add this repository URL
3. Enable the theme in Appearance settings

## ✨ Features

### 🎨 Comprehensive UI Styling

- **Editor Interface**: Dark blue backgrounds with excellent text contrast
- **Sidebar Navigation**: Consistent theming for file explorer, tags, and outline
- **Tab Management**: Active and inactive tab styling with Night Owl colors
- **Status Bar**: Seamlessly integrated bottom status bar
- **Modal Dialogs**: Settings, command palette, and popup windows
- **Graph View**: Custom node and connection colors

### 🌈 Syntax Highlighting

- **Headings**: Gradient colors from blue to purple for different heading levels
- **Links**: Distinctive blue (`#82AAFF`) for internal and external links
- **Code Blocks**: Syntax highlighting with Night Owl's signature colors:
  - Keywords: Purple (`#c792ea`)
  - Strings: Green (`#c5e478`)
  - Numbers: Orange (`#F78C6C`)
  - Comments: Muted blue (`#5f7e97`)
- **Inline Code**: Highlighted with subtle background and accent colors
- **Blockquotes**: Styled with left border and italic text

### 🎯 Interactive Elements

- **Buttons**: Hover effects with Night Owl purple accents
- **Checkboxes**: Custom styling for task lists and checkboxes
- **Tags**: Rounded tags with Night Owl color scheme
- **Search**: Highlighted search results and input fields
- **Scrollbars**: Subtle, themed scrollbar styling

### 📱 Responsive Design

- **Mobile Support**: Optimized for Obsidian mobile apps
- **Plugin Compatibility**: Works well with popular community plugins
- **Accessibility**: High contrast ratios meeting WCAG guidelines

## 📸 Screenshots

### Main Interface

*Screenshot placeholder - showing the main Obsidian interface with Night Owl theme*

### Editor View

*Screenshot placeholder - demonstrating syntax highlighting and editor styling*

### Graph View

*Screenshot placeholder - showing the graph view with Night Owl colors*

### Settings Panel

*Screenshot placeholder - displaying the settings interface with theme applied*

## 🎨 Color Palette Reference

### Primary Colors

```css
--night-owl-bg-primary: #011627     /* Main background */
--night-owl-bg-secondary: #0b253a   /* Secondary background */
--night-owl-bg-tertiary: #021320    /* Tertiary background */
--night-owl-text-primary: #d6deeb   /* Primary text */
--night-owl-text-secondary: #5f7e97 /* Secondary text */
```

### Accent Colors

```css
--night-owl-accent-purple: #c792ea  /* Keywords, operators */
--night-owl-accent-blue: #82AAFF    /* Functions, links */
--night-owl-accent-cyan: #7fdbca     /* Constants, attributes */
--night-owl-accent-green: #c5e478    /* Strings, success */
--night-owl-accent-yellow: #ecc48d   /* Variables, warnings */
--night-owl-accent-orange: #F78C6C   /* Numbers, parameters */
--night-owl-accent-red: #EF5350      /* Errors, deletions */
--night-owl-accent-pink: #ff5874     /* Special elements */
```

### UI Elements

```css
--night-owl-border: #122d42          /* Borders, dividers */
--night-owl-selection: #1d3b53       /* Text selection */
--night-owl-highlight: #5f7e9779     /* Search highlights */
```

## 🙏 Credits

This theme is a port of the original **Night Owl** theme created by [Sarah Drasner](https://github.com/sdras).

- **Original Theme**: [Night Owl VSCode Theme](https://github.com/sdras/night-owl-vscode-theme)
- **Creator**: [Sarah Drasner](https://sarahdrasnerdesign.com/)
- **Obsidian Port**: Adapted for Obsidian with additional UI elements and mobile support

Special thanks to Sarah Drasner for creating such a beautiful and functional color scheme that has inspired developers and designers worldwide.

## 📋 Version Information

- **Current Version**: 1.0.0
- **Minimum Obsidian Version**: 1.0.0
- **Last Updated**: November 2024
- **Compatibility**: Desktop and Mobile versions of Obsidian

### Version History

- **v1.0.0**: Initial release with complete Night Owl color scheme implementation

## 🤝 Contributing

We welcome contributions to improve the Night Owl theme! Here's how you can help:

### Reporting Issues

1. Check existing [Issues](../../issues) to avoid duplicates
2. Create a new issue with:
   - Clear description of the problem
   - Screenshots if applicable
   - Your Obsidian version and operating system
   - Steps to reproduce the issue

### Suggesting Improvements

- Open an issue with the "enhancement" label
- Describe your suggested improvement
- Explain why it would benefit users

### Contributing Code

1. Fork this repository
2. Create a feature branch (`git checkout -b feature/improvement-name`)
3. Make your changes to `theme.css`
4. Test thoroughly with different Obsidian features
5. Commit your changes (`git commit -am 'Add some improvement'`)
6. Push to the branch (`git push origin feature/improvement-name`)
7. Create a Pull Request

### Development Guidelines

- Maintain consistency with Night Owl color palette
- Test changes across different operating systems
- Ensure mobile compatibility
- Follow existing CSS organization and commenting style
- Update version numbers appropriately

## 📄 License

This theme is released under the MIT License. See [LICENSE](LICENSE) for details.

## 🔗 Links

- [Original Night Owl VSCode Theme](https://github.com/sdras/night-owl-vscode-theme)
- [Sarah Drasner's Website](https://sarahdrasnerdesign.com/)
- [Obsidian Community](https://obsidian.md/community)
- [Report Issues](../../issues)
- [Latest Releases](../../releases)

---

*Made with ❤️ for the Obsidian community*