SCSS Integration
Styles are structured with SCSS to keep your CSS maintainable and organized.
About Phone1st
A lightweight HTML starter theme for building quicker projects.
Phone1st is a clean, streamlined starter theme designed to help you launch smarter web projects in less time.
Core Technology
Built with modern workflows and practical flexibility in mind.
CodeKit Optimized
Designed for CodeKit on Mac, including kit templates and variable-driven workflows.
Flexible Framework
SCSS and CSS assets can be adapted to any build setup, as long as an SCSS processor is available.
Performance
Utility-rich CSS is ~82kb, minifies to ~28kb, and can be further reduced with PostCSS purging.
Getting Started
- 1 Download the theme files.
- 2 Rename the folder to match your project.
- 3 Import the folder into CodeKit.
- 4 Build your site using the included test folder as a guide.
Pro Tip: Once development is complete, remove the test folder and upload the build folder to your server.
The Test Folder
A complete visual reference for your components and styling system.
Test Page
Set and preview foundational HTML elements.
Scss Page
Reference the default mixins available in the theme.
Class Page
Browse utility classes you can use immediately.
Built-in SEO & Metadata
Ready-to-use variables for basic SEO, including Facebook and Twitter meta tags.
- Page Title: Basic titles for navigation.
- SEO Title: Descriptive titles (about 60 chars).
- Description: Page summaries (about 120 chars).
- Canonical URL: Exact page URLs.
- Post Image: Social media preview images.
Experimenting with Classes
We are actively exploring utility-first class styling. Traditional stylesheets are still great for complex elements, but utility classes help maintain consistency and speed up development. Try them in your own workflow and evolve what works best.